CODEWITHSUNDEEP
javascriptjqueryjquery-ui
subho das
subho das

Reputation: 391

not able to modify last <li> with jquery?

I have some nested <UL><li><ul><li>text</li></ul></li></UL>, I want to modify last child using jquery, but when I am writing $("#id li:last-child") it affecting all nested <li>s. here is the code.

<ul id="ddmenu">
<li><a href="#">Home></a>
    <ul>        

          <li><a href="#">QA Managers Dashboard</a></li>    
    </ul> 
 </li>

<li><a href="#">Req Mgmt</a>
    <ul>
        <li><a href="#">Panel Beating</a></li>
        <li><a href="#">Car Inspection</a></li>
    </ul>

</li>
<li><a href="#">Test</a>
    <ul>
        <li><a href="#">Work Place</a></li>
        <li><a href="#">Special Events</a></li>
    </ul>
</li>
<li><a href="#">Project</a>
    <ul>
        <li><a href="#">Enquiry</a></li>        
    </ul>
</li>
   <li><a href="#">More</a></li>

I want to modify the <li> which contains text "More"... how to do that?? any help please?

Upvotes: 0

Views: 77

Answers (4)

David Thomas
David Thomas

Reputation: 253318

Just as out of general interest (and I accept that your problem's already solved) but the following also works:

$('li:last-child:last').css('color','red');

JS Fiddle demo.

I understand why it works this way, but I must confess that when I first wrote that selector I expected that $('li:last-child:first') would work.

Upvotes: 0

Vivek Viswanathan
Vivek Viswanathan

Reputation: 1963

Try using the below code,

$("#id > li:last-child")

the symbol ">" represents direct children of the parent element.

Upvotes: 0

Tetaxa
Tetaxa

Reputation: 4403

Use > to get only direct descendants like this

$("#id > li:last-child")

Upvotes: 4

Frederik.L
Frederik.L

Reputation: 5620

I you know how much items you have, you can try $("#id li:nth-child("+nbrItems+")");

Hope this helps

Upvotes: 0

Related Questions