Question

We have list in html:

<ul class="list">
<li>some text<li>
<li>some text<li>
<li>some text<li>
<li>some text<li>
<li>some text<li>
...
<li>some text<li>
</ul>

There can be more than 100 <li>

How to do:

1) Add for each <li> id with number, like:

<li id="item1">some text<li>
<li id="item2">some text<li>
...
<li id="item200">some text<li>

and so on, to the end.

2) Count all <li> inside <ul class="list">

3) After second step, if there are more than 60 <li>, add their IDs (item number) to array 1, all other’s <li> IDs add to array 2 (from 60 to the end, from 60 to 500 if there are 500 <li>).

Thanks!

Answer 1

Step 1:

var $li = $('ul.list > li').attr('id', function(i) { return "item" + (i + 1) });

Step 2:

var count = $li.length;

Step 3:

if(count > 60) {
    var arr1 = $li.slice(0,60);
    var arr2 = $li.slice(60);
}

EDIT: Mis-spelled function. Fixed.

Note: Of course, you don’t need a count variable. $li.length can go inside the if() statement.

Note: The .slice() method will return a jQuery object. If you actually want an array, add .get() after .slice(). Or with jQuery 1.4 or later, you can use .toArray().