Selectores

Son tres tipos de selectores que podemos utilizar

$('p') selecciona cualquier etiqueta html
$('#ud-id')  selecciona los ids de la etiquetas o divs
$('.clase') Selecciona todos los elementos que tengan la clase

Se genera un bucle automatico que busca los elemtos que se pasan como parametro, es decir nos ahorramos el for.


Ejemplo: Esto se lee asi buscas los hijos  li de id  selected-plays y le aplica el estilo horizontal
 y las que no sean hijos directos de  selected-plays  que son li y no se le aplico  el estilo horizonal le aplicias el estilo 'sub-level'

$(document).ready(function() {
  $('#selected-plays > li').addClass('horizontal');
  $('#selected-plays li:not(.horizontal)').addClass('sub-level');
 });

.horizontal {
  float: left;
  list-style: none;
  margin: 10px;
}


<ul id="selected-plays" class="clear-after">
  <li>Comedies
    <ul>
        <li><a href="/asyoulikeit/">As You Like It</a></li>
        <li>All's Well That Ends Well</li>
        <li>A Midsummer Night's Dream</li>
        <li>Twelfth Night</li>
    </ul>
  </li>
  <li>Tragedies
    <ul>
        <li><a href="hamlet.pdf">Hamlet</a></li>
        <li>Macbeth</li>
        <li>Romeo and Juliet</li>
    </ul>
  </li>
  <li>Histories
    <ul>
        <li>Henry IV (<a href="mailto:henryiv@king.co.uk">email</a>)
        <ul>
          <li>Part I</li>
          <li>Part II</li>
              </ul>
            </li> 
            <li><a href="http://www.shakespeare.co.uk/henryv.htm">Henry V</a></li>
            <li>Richard II</li>
    </ul>
  </li>
</ul>