CODEWITHSUNDEEP
jqueryhtml-lists
Imran
Imran

Reputation: 1104

How to detect LI element number inside an UL elemen using its class in jQuery?

I have an UL element with its child LI elements for example I need to know what is the position or number (i.e. 4 in list given below) of first LI element containing class "Branding" in LI items. I need its solution in jQuery.

<ul class="thumbs">
   <li class="logos">Some Inner contents</li>
   <li class="logos">Some Inner contents</li>
   <li class="logos">Some Inner contents</li>
   <li class="Branding">Some Inner contents</li>
   <li class="Branding">Some Inner contents</li>
   <li class="Branding">Some Inner contents</li>
   <li class="Branding">Some Inner contents</li>
   <li class="website">Some Inner contents</li>
   <li class="website">Some Inner contents</li>
   <li class="website">Some Inner contents</li>
</ul>

Upvotes: 1

Views: 1120

Answers (2)

Ortiga
Ortiga

Reputation: 8814

To count:

var ul = $('ul.thumbs');

ul.children('.logos').size(); //3
ul.children('.Branding').size(); //4
ul.children('.website').size(); //3

To get the index:

ul.children('.logos').first().index(); //0
ul.children('.Branding').first().index(); //3
ul.children('.website').first().index(); //7

Upvotes: 4

JP Hellemons
JP Hellemons

Reputation: 6047

Because you need to know the position, I think you need to loop: http://api.jquery.com/jQuery.each/ 

var retIndex = 0;
$.each(".ul li", function(index, value) { 
    retIndex = index;
    if(this.hasClass("branding"))
    {
        alert('found at: ' + index);
        return retIndex;
    }
});

Upvotes: 0

Related Questions