CODEWITHSUNDEEP
javascriptjqueryhtmlcounthtml-lists
Rien
Rien

Reputation: 458

Count all first list items in ul

I was wondering how to count all the list items inside a div.

<ul class="menu">
    <li><a href="#">Home</a>
    </li>
    <li><a href="#">Contact</a>
    </li>
    <li><a>Information</a>
        <ul>
            <li><a href="#">History</a>
            </li>
            <li><a href="#">Present</a>
            </li>
            <li><a href="#">Future</a>
            </li>
        </ul>
    </li>
    <li><a>Tutorials</a>
        <ul>
            <li><a href="#">HTML/CSS</a>
            </li>
            <li><a href="#">Javascript</a>
            </li>
            <li><a href="#">Jquery</a>
            </li>
            <li><a href="#">PHP</a>
            </li>
        </ul>
    </li>
    <li><a href="#">Structure</a>
    </li>
</ul>

How do I count all the list elements inside ul class=menu? And not the list items who are in a deeper UL.

What I mean is how to count Home, Contact, Information, Tutorials, Structure, and not the list elements who are inside these I just mentioned.

Of course I did some research but couldn't find the correct answer. Here is somewhat of a duplicate: jQuery: Count number of list elements?

Upvotes: 3

Views: 8464

Answers (2)

Alessandro Minoccheri
Alessandro Minoccheri

Reputation: 35973

The other question is in jQuery, so I answer for jquery, try this to count your li elements

var count = $('ul.menu').children('li').length;

DEMO

Upvotes: 2

David Hellsing
David Hellsing

Reputation: 108500

Use the > child selector:

$('ul.menu>li').length

Or .children():

$('ul.menu').children('li').length

Upvotes: 10

Related Questions