title: Format 2nd child from a list item
body: <p>I have a <code>ul</code> item and within it I have 2 more <code>ul</code> items. I need to format the 2nd row in the <code>ul</code>.</p>
  
  <p><a href="http://jsfiddle.net/M345N/" rel="nofollow"><strong>Demo Fiddle</strong></a></p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;ul class="horizontal"&gt;
      &lt;li&gt;First List
      &lt;ul class="ul1"&gt;
          &lt;li&gt;first&lt;/li&gt;
          &lt;li&gt;Second&lt;/li&gt;
          &lt;li&gt;Third&lt;/li&gt;
      &lt;/ul&gt;
      &lt;li&gt;Second List
      &lt;ul&gt;
          &lt;li&gt;first&lt;/li&gt;
          &lt;li&gt;Second&lt;/li&gt;
          &lt;li&gt;Third&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.horizontal &gt;li {
    float: left;
    list-style: none;
    margin: 10px;
  }
  
  ul:nth-child(2) {
      color:RED
  }
  </code></pre>