CODEWITHSUNDEEP
jqueryhtml-lists
Gihanmu
Gihanmu

Reputation: 407

How to select all list elemnets of a specific <ul> in jquery?

//first ul    
<ul>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    //second ul
        <ul >
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>

I want to write some text only into all the <li> elements of 2nd unordered list. I want my jquery to ignore <li>s in first <ul>

Here is what I attempted, but it did not work:

$("ul:nth-child(1) li").eq(1).each(function(){
                $(this).text("Lorem Ipsum");

            });

Upvotes: 0

Views: 587

Answers (8)

Bhojendra Rauniyar
Bhojendra Rauniyar

Reputation: 85545

You need to select nth-child(2) not 1 and not eq(1) since you need all list:

$("ul:nth-child(2) li").each(function(){
     $(this).text("Lorem Ipsum");
});

As difference notified by @Rajaprabhu you may wish to use eq() method instead of nth-child():

$("ul:eq(1) li").each(function(){
    $(this).text("Lorem Ipsum");
});

Upvotes: 1

Rachit Patel
Rachit Patel

Reputation: 862

if you want to find out all the 'ul" of page then use below code 

$j("ul").each(function () {

});

if you want to find out specific "ul" under specific class or element then use below code

$j(".ClassName ul").each(function () {

});


$j("#ParentElementId ul").each(function () {

});

Upvotes: 1

Satpal
Satpal

Reputation: 133403

I want to write some text only into all the <li> elements of 2nd unordered list.

You can use :eq(index)

Select the element at index n within the matched set.

Note: Zero-based index of the element to match

Use

$("ul:eq(1) li").text("Lorem Ipsum")

DEMO

EDIT: Be wise to chooses between :eq() and :nth-child()

See comparative example

Demo with :eq() vs Demo with :nth-child()

Upvotes: 1

Junsui
Junsui

Reputation: 1

You can use

$("ul:eq(X) li").text("Text to write in second ul")

Where X = what UL you want. Here is an example: http://jsfiddle.net/Q2gj6/2/

Upvotes: 0

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67187

Try to use the :eq() selector,

$("ul:eq(1) > li").each(function(){
   $(this).text("Lorem Ipsum");
});

DEMO

Upvotes: 1

Javi Mu&#241;oz Tous
Javi Mu&#241;oz Tous

Reputation: 88

you could give a Id to your second ul and selected directly

$('#anyId li').each(function(){
    $(this).text("Lorem Ipsum");
});

Upvotes: 0

Kiranramchandran
Kiranramchandran

Reputation: 2094

Try this

$('ul:nth-child(2) li').each(function(){
    $(this).text("Lorem");
});

DEMO HERE

Upvotes: 2

Anoop Joshi P
Anoop Joshi P

Reputation: 25527

Try

$("ul:eq(1)").find("li").each(function(){
  $(this).text("Lorem Ipsum");
});

:eq(1) selects the element with index 1. Then you can use .find() to get the child elements.

Upvotes: 1

Related Questions