jQuery : Get first closest "parent" by type?
<p>I need to get the <code>id</code> of the first closest (nearest) <code>li</code> parent element when i click on <code>a</code> element.</p>

<pre><code>&lt;ul&gt;
    &lt;li id="wrong1"&gt;
        &lt;ul&gt;
          &lt;li id="p1"&gt;
            &lt;a href="" class='btn'&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li id="p2"&gt;
            &lt;a href="" class='btn'&gt;Click here!&lt;/a&gt;
          &lt;/li&gt;
          &lt;li id="p3"&gt;
            &lt;a href="" class='btn'&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li id="wrong2"&gt;&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>When i clicked on <code>Click here!</code>, i'm supposed to get <code>li#p2</code> element.</p>

<p>I used:</p>

<pre><code>$('a.btn').click(function(e) {
    var GotIt = $(this).parents().find('li').attr('id');
});
</code></pre>

<p>But apparently it didn't work. I also tried <code>closest()</code> and also the same outcome.</p>

<p>How to get the element properly please?</p>