Generating an unordered list with jQuery

Question

There is unordered list , which not works properly in IE6-7, I would like want to replace it by a jQuery function .

So, we have:

• simple list with special #id (ul id="")
• some <li> tags
• some special tag in <li> to show the number of a row (or something else, as you wish).

I need a function which will give an unique number for each row, from the beginning to the end of our unordered list. (ul)

Answer 1

<ul><li>test</li><li>test</li><li>test</li><li>test</li><li>test</li><li>test</li><li>test</li></ul>

$(document).ready(function(){   
    var increment=3;
    var start=8;
    $("ul").children().each(function(i) {
        $(this).prepend('<tag>'+(start+i*increment).toString()+'.</tag>');
    });
});

result:

* 8. test
* 11. test
* 14. test
* 17. test
* 20. test
* 23. test
* 26. test

edit: without increment and shorter:

$(document).ready(function(){   
    $("ul").children().each(function(i) {
        $(this).prepend('<b>'+(1+i).toString()+'.</b> ');
    });
});

Answer 2

Referring to this post Generating an unordered list with jQuery

Is there a way to start count all over again for another list using ul? With the code above this is what i get! <ul> <li> test <li> test <li> test <ul/>

Output
1. test
2. test
3. test

second ul list

<ul> <li> test <li> test <li> test <ul/>

Output
4. test
5. test
6. test

Instead of starting the second ul tag with 1. 2. 3. it continues to count using the first ul 5. 6. 7.

So is it possible to reset the count and star it all over again for another ul tag?

Answer 3

I think this should work, no?

$(function() {
    $('#the_ul_ID li').each(function(i) { $(this).attr('rel',++i); });
});