Can't select direct parent element
<p>I have this html page which globally exists of <code>div</code>, <code>section</code>, and <code>ul</code> elements (of course some more, but those are the most common)</p>

<p>Now in my fourth list on the page (e.g. below in bold)</p>

<pre><code>
&lt;body&gt;
 &lt;div&gt;
  &lt;header&gt;
   &lt;ul id="firstList"&gt;
    &lt;li&gt;
    [..]
  &lt;section&gt;
   &lt;ul id="secondList"&gt;
    [..]
  &lt;section&gt;
   &lt;ul id="thirdList"&gt;
   [..]
  &lt;section&gt;
   &lt;ul id="fourthList"&gt;
    &lt;li&gt;&lt;a&gt;Test 1&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a&gt;Test 2&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a&gt;Test 3&lt;/a&gt;&lt;/li&gt;
   &lt;/ul&gt;
  [..]
</code></pre>

<p>The thing is that, when someone clicks on a test, i want to loop through the list-items to look the position of the click up in the list (it there are items before or after)</p>

<p>Herefore i have the following</p>

<pre><code>
$("a").click(function(event){
 [..]
 var parentEl = $(this).parents('ul').filter(":first").tagName;
 alert($(parentEl).attr("id"));
});
</code></pre>

<p>But this gives me <code>firstList</code> as an output. I assume jQuery looks through the document from top down, so the output with <code>filter(:first)</code> (oh and <code>get(0)</code>) as well makes sence i guess.. But how am i going to get the first parent of the clicked link?</p>

<p>If someone click on <code>Test 2</code> i want to get <code>fourthList</code> as an output (and eventually the position, but that's for later)</p>
