title: "#orderedlist > li" selector
body: <p>I'm studying jQuery with <a href="http://docs.jquery.com/Tutorials:Getting_Started_with_jQuery" rel="nofollow noreferrer">this</a> tutorial, but one of examples doesn't work.</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;style type="text/css"&gt;
        a.test { font-weight: bold; background: #fc0 }
      &lt;/style&gt;
      &lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript"&gt;
        $(document).ready(function(){
          $("#ol &gt; li").addClass("test");
          $("#some").addClass("test");
        });
      &lt;/script&gt;
      &lt;/head&gt;
     &lt;body&gt;
       &lt;a href="http://jquery.com/" id="some"&gt;Some&lt;/a&gt;
       &lt;ul id="ol"&gt;
        &lt;li&gt;one&lt;/li&gt;
        &lt;li&gt;two&lt;/li&gt;
        &lt;li&gt;three&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>This example apply the "test" style to hyperlink (#some), but doesn't apply this style to the ordered list (#ol).  Why?</p>