jQuery get first five <li>

Question

<ul>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
    <li>text</li>
</ul>

How to add some class only for first five <li>?

Answer 1

$('ul li:lt(5)')

This selects all <li>s of <ul> whose index is less than 5 (i.e., 0-4, or the first five)

Answer 2

Use the :lt selector:

$("ul > li:lt(5)").addClass("foo");

Answer 3

Apart from :lt() selector, you can also use slice() function.

$('li').slice(0, 5).addClass('someClass');

Answer 4

for the first five you will want to use

$('ul li:lt(5)').addClass('first-five');