Is there a way to select an element without going back to the parent element first
<p>I am trying to select class <code>this</code> and then get <code>that</code> without traversing first to the parent <code>tr</code> element.</p>

<p>This my HTML:</p>

<pre><code>&lt;tr&gt;
    &lt;td&gt;
        &lt;div&gt;some content&lt;/div&gt;
        &lt;select class="this"&gt;
            &lt;option&gt;1&lt;/option&gt;
            &lt;option&gt;2&lt;/option&gt;
        &lt;/select&gt;
    &lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
    &lt;td&gt;
        &lt;div&gt;some content&lt;/div&gt;
        &lt;select class="that"&gt;
            &lt;option&gt;1&lt;/option&gt;
            &lt;option&gt;2&lt;/option&gt;
        &lt;/select&gt;
    &lt;/td&gt;
&lt;/tr&gt;
</code></pre>

<p>Here is my jQuery:</p>

<pre><code>$('.this').each(function () {
    var thisSelect = $(this),
        thatSelect = $(thisSelect).next('.that');

    console.log(thatSelect); // doesn't work
});
</code></pre>

<p>I tried to use the code above but it didn't work. I am using <code>each</code> function because there are more than one sets of these select elements on a page.</p>
