Question

I try to understand how the jQuery Object Accessors index() works. But I don’t understand anything! (see http://jsfiddle.net/St4D7/)

So I have a HTML list item:

<ul>
<li>test 1</li>
<li>test 2</li>
<li>test 3</li>
</ul>

And jQuery:

$('ul li').click(function(){
    console.log($(this).index());
});

I’d like to have the index position of items on click (like 1, 2 or 3), that’s all. Please help.

PS : I don’t want to use each() or eq()… just index().

Answer 1

As described in the documentation, index returns the zero-indexed position of the first element depending on the parameters you provide, in the jQuery object you call it on.

However, you also seem to be slipping up on the context of this.

At the time you call $(this).index(), this points to the lil element that was clicked on. Therefore $(this) contains a jQuery object containing one element.

Instead, try something like this:

var obj = $('ul li').click(function(){
    console.log(obj.index(this));
});