How to get element order number

Question

Hello everyone,

how can i get order number of some element by javascript/jquery?

<ul>
 <li>Anton</li>
 <li class="abc">Victor</li>
 <li class="abc">Simon</li>
 <li>Adam</li>
 <li>Peter</li>
 <li class="abc">Tom</li>
</ul>

There is 3xli with abc class. Now I need to get order(sequence) number of Simon li.

Thanks in advance

Answer 1

With Jquery's index() method

Answer 2

if you want to get the 'global' index use

$('ul').find('li:contains(Simon)').index()

in case you want the index from abc-class use

$('li.abc').find('li:contains(Simon)').index()

Kind Regards

--Andy

Answer 3

You can do it like this using a selector with .index(), like this:

$('li:contains(Simon)').index('.abc'); //returns 1, it's 0 based
//Or this...
$('li').filter(':contains(Simon)').index('.abc'); //returns 1

Without the selector, you'd get 2, the index of the <li> in the parent overall, regardless of the class. You can view a quick demo here. Keep in mind it's a 0 based index, may need to + 1 the result for display in some cases, depends what you need it for.