jQuery: nextAll independent of parents
<p>I'm building a small lightbox-plugin (just for fun) and if the user presses a key, it should open (simulate click) the next link having the same "rel"-attribute.</p>

<pre><code> .nextAll('.box[rel="'+boxed+'"]').eq(0).click();
</code></pre>

<p>The code above works for the following example:</p>

<pre><code>&lt;a href="/1.jpg" class="box" rel="box-abc123"&gt;One&lt;/a&gt;
&lt;a href="/2.jpg" class="box" rel="box-abc123"&gt;Two&lt;/a&gt;
&lt;a href="/3.jpg" class="box" rel="box-abc123"&gt;Three&lt;/a&gt;
</code></pre>

<p>But if the images are in different parent-elements, like…</p>

<pre><code>&lt;header&gt;&lt;a href="/1.jpg" class="box" rel="box-abc123"&gt;One&lt;/a&gt;&lt;/header&gt;
&lt;section&gt;&lt;a href="/2.jpg" class="box" rel="box-abc123"&gt;Two&lt;/a&gt;&lt;/section&gt;
&lt;footer&gt;&lt;a href="/3.jpg" class="box" rel="box-abc123"&gt;Three&lt;/a&gt;&lt;/footer&gt;
</code></pre>

<p>…it doesn't work. Of course I could use parent() to jump, but I want to build it completely independent of parent-elements (as there aren't some always). Is there a way to find the next element independent of any parent-elements? Does anybody know how to solve this? Thank you!</p>
