Jquery select only first ul inside div
<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>