How to select all <li> in an <ul> with a classname "nav"?

Here's a tip that will help people learn selectors:

Use the Chrome browser Open up any page Right click on the page and select "Inspect element" In the element inspector select the Console tab

You can type commands right into this console. Try a few selectors only and see what you get. If you type $('p') and hit enter it will list out all the p elements. If you enter $('ul.nav li) it will show you if that selector works (returns anything). If the command does not result in a valid selector it will return [].


select all li in an ul with a class of nav

like so, selects all li's in an ul with the .nav class:

$('ul.nav li')

Append it after the element selector:

$("ul.nav li");

This selects all <li> elements in a <ul class="nav"> element

See the docs: http://api.jquery.com/class-selector/


Constructively,

  1. All ul elements:

    $("ul")
    
  2. All ul elements with a classname nav:

    $("ul.nav")
    
  3. All li elements under all ul elements with a classname nav:

    $("ul.nav li")