Yetimwork Beyene
Yetimwork Beyene

Reputation: 2337

How to find the upto the last li element using jquery?

I have the following html content....

I need to search only the li(s) text within an ul element

For example,

$("#ul_first").find(li).each(function(index,value)
{
    alert(index)
});

The problem here is that find method finds li in the #ul_second element. I only want it to find li elements within a certain ul element and not child ul elements.

<ul id="ul_first">
     <li>a</li>
     <li>b</li>
     <li>c</li>
     <li>d</li>
     <li>c
             <ul id="ul_second">
                               <li>a</li>
                               <li>b</li>
                               <li>c</li>
                               <li>d</li>
             </ul>    
     </li>
</ul>

Upvotes: 0

Views: 49

Answers (4)

Pandian
Pandian

Reputation: 9126

you can try like below... it will help you

Fiddle :http://jsfiddle.net/RYh7U/119/

Traversing/children

$('#ul_first').children('li').each(function(index,value) 
{     
 alert(index); 
});

Upvotes: 1

Bill
Bill

Reputation: 3517

Change your selector to '#ul_first > li'. This checks for all li's that are a child of #ul_first.

The child selector, >, matches when the next selector is a direct child of it's parent.

Source: http://www.w3.org/TR/CSS2/selector.html#child-selectors

Upvotes: 0

Evan Knowles
Evan Knowles

Reputation: 7501

Tried using `$("#ul_first > li")$? This should find li elements that are directly below ul_first

Upvotes: 0

Mike Mackintosh
Mike Mackintosh

Reputation: 14237

Try adding the child selector. > will select ONLY direct children. Using find is like ommiting the > which will choose ALL descendants.

$("#ul_first > li").each(function(index,value) { alert(index) });

Upvotes: 1

Related Questions