jQuery: count of first level of li tags (exclude decendent ul > li tags)

Question

HTML:

<ul id='top_nav'>
  <li><a href="">xxx</a></li>
  <li><a href="">xxx</a></li>
  <li><a href="">xxx</a></li>
  <li>
    <ul>
      <li><a href="">xxx</a></li>
      <li><a href="">xxx</a></li>
    </ul>
  </li>
  <li><a href="">xxx</a></li>
</ul>

Question:

How can I get the count of the first level of li tags? So in this example, the output would be 5, not 7.

Answer 1

$("#top_nav > li").size() should do the trick.

This works because a selector akin to foo > bar selects the immediate children of foo that match bar. the size() function returns the number of entities selected.