Question

I have an unordered list which contains several items called ‘oListItems’ the UL has a class but no id.

The class OuteroListItems contains many of oListitems

 oList.AppendFormat("<ul class='OuteroListItems'>");
            oList.AppendFormat("<li>");
            oList.AppendFormat("<ul class='oListItems'>");
            oList.AppendFormat("<li>" + s.sName + "</li>");
            oList.AppendFormat("<li>" + s.eName + "</li>");
            oList.AppendFormat("<li>" + s.SDate + "</li>");
            oList.AppendFormat("<li>" + s.EDate + "</li>");
            oList.AppendFormat("</ul>");
            oList.AppendFormat("</li>");
            oList.AppendFormat("</ul>");

I want for each .oListItem class that gets retrieved, add dynamically an id to it.

 var o = $(".oListItem");

    $.each(o, function (){

      var f = $(this).attr("id", 'listItem' + i);

        i++;
    });

wasent sure on the approach, this is what I have so far?

Answer 1

You can do this use .each() (off the element collection), note that ID cannot start with a number:

$('.oListItems').each(function(i) {
  $(this).attr('id', 'listItem' + i);
});

The .each() function gets 2 parameters, (index, element), you just need the first, in this case i is the index (zero-based) of the current .oListItem you’re on.