Question

I have a page with dynamically generated content, that looks something like the following:

<ul class="alist">
  <li>something</li>
  <li>something</li>
</ul

<ul class="alist">
  <li>something</li>
  <li>something</li>
</ul>

<ul class="alist">
  <li>something</li>
  <li>something</li>
</ul>

Notice that none of the unordered lists have any id or unique class identifier.

I need to assign an id to each ul, but a different one each time, and I don’t know how many unordered lists will be on the page at any given time.

I want to assign a number to each unordered list as an id. So, the first ul should be assigned the ID of 1. The second unordered list should be assigned an ID of 2 and so on, for however many unordered lists may appear on the page…and I don’t even have a clue where to start.

Answer 1

document.getElementsByTagName is your best friend here. Applying some magic, it could look like

var idcounter = 1;
[].forEach.call( document.getElementsByTagName( 'ul' ), function( ul ) {
    ul.id = 'myID-' + idcounter++;
});

Demo: http://jsfiddle.net/xgkMx/