jQuery select child of closest element
<p>Basically I want to be able to select the div level2 parent from the child level4 div. My application does not has such classes, otherwise I'd just select level2 :)</p>

<pre><code>&lt;div class="level1"&gt;
  &lt;div class="level2"&gt;
    &lt;div class="level3"&gt;
      &lt;div class="level4"&gt;&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="level2"&gt; &lt;!-- this is hidden --&gt;
    &lt;div class="level3"&gt;
      &lt;div id="start" class="level4"&gt;&lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>I start with <code>$('#start')</code> and search for the first parent which is visible, but I'm not seeing a way to return the child of that parent. Searching for <code>$('#start')</code> inside the parent seems very wasteful as I start with a sub child to begin with.</p>

<pre><code>$('#start').closest(':visible') // returns level1
$('#start').closest(':visible').first() // returns the first level2. I can't just use second because the number of level2s can change.
$('#start').closest(':visible').children().each(function(){ /* do some search to check it contains `$('#start')` }) // seems very wasteful.
</code></pre>

<p>Another way to look at what I'm trying to say would be; start in the middle, find the outside (the visible element), and move one element in.</p>
