CODEWITHSUNDEEP
jquery
Strontium_99
Strontium_99

Reputation: 1803

Get the index position of an li with a specific class using jquery

I'm trying to get jquery to return the index position of the top level li with a class of .open. EG:

<ul>
  <li class="open">something
     <ul>
        <li>ignore this</li>
        <li>ignore this</li>
     </ul>
  </li>
  <li>something</li>
  <li class="open">something</li>
</ul>

So in the case of the above, I want it to ignore anything below the second ul. And return the index position of the top level (IE. ul li siblings only) with the class of .open.

So the above would return: 0 and 2

I've tried this:

console.log($('ul:first li.open').index());

But this returns odd results. I've also tried this:

$('ul:first li.open').each(function(){
   console.log($(this).index());
}

But again this doesn't return the expected results.

Thanks.

Upvotes: 1

Views: 733

Answers (2)

Dobromir Yordanov
Dobromir Yordanov

Reputation: 89

Were you looking for something like this? The '>' will assure only immediate children are selected.

$(document).ready(function(){
    $('ul:first > li.open').each(function(){
        console.log($(this).index());
    });
});

Upvotes: 1

A. Wolff
A. Wolff

Reputation: 74420

Pass string selector to index() method:

 console.log($(this).index('.open'));

This will return 0 and 1.

DEMO jsFiddle

Upvotes: 4

Related Questions