title: Jquery select only first ul inside div
body: <p>I have a <code>ul</code> in <code>div</code>. And I have another <code>ul</code> inside <code>li</code>. I need to select only first <code>ul</code> which located inside the <code>div</code>. How to achieve that in jquery.</p>
  
  <p>The markup.</p>
  
  <pre><code>&lt;div class="parent"&gt;
    &lt;div class="clearfix"&gt;
      &lt;div class="another-div"&gt;
        &lt;ul class="first-ul"&gt;
          &lt;li&gt;First&lt;/li&gt;
          &lt;li&gt;Second&lt;/li&gt;
          &lt;li&gt;Third&lt;/li&gt;
          &lt;li&gt;Fourth&lt;/li&gt;
          &lt;li&gt;Fifth&lt;/li&gt;
          &lt;li&gt;
            &lt;ul class="second-ul"&gt;
              &lt;li&gt;First&lt;/li&gt;
              &lt;li&gt;Second&lt;/li&gt;
              &lt;li&gt;Third&lt;/li&gt;
              &lt;li&gt;Fourth&lt;/li&gt;
              &lt;li&gt;Fifth&lt;/li&gt;
            &lt;/ul&gt;        
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I want to select the <code>first-li</code> using only <code>parent</code> class. I have tried <code>$('.parent &gt; ul')</code> but this is not working. and <code>$('.parent ul')</code> but this selects both ul. I don't want to use <code>first-ul</code> class or anything.</p>