Finding the next element to link clicked by class with Jquery
<p>I've got some HTML markup that looks like this:</p>

<pre><code> &lt;tr&gt;
    &lt;td&gt;
        &lt;a href="javascript:void(0)" class="slideNextSlidable"&gt;Click Here&lt;/a&gt;
    &lt;/td&gt;
&lt;/tr&gt;
&lt;tr class="slidable"&gt;
    &lt;td&gt;
    &lt;p&gt;Hide me&lt;/p&gt;
    &lt;/td&gt;
&lt;/tr&gt;
</code></pre>

<p>And my javascript / jquery:</p>

<pre><code>$(function() {
    $('.slideNextSlidable').click(function() {
        $(this).parent().next('.slidable').hide();
    });
});​
</code></pre>

<p>However, this doesn't seem to be getting the <code>.slidable</code> <code>tr</code></p>

<p>I'm trying to hide the <code>.slidable</code> row that's next (or nearest to) the clicked <code>.slideNextSlidable</code> link.</p>

<p>This is nested in a foreach loop (there are many of these rows)</p>

<p>See fiddle: <a href="http://jsfiddle.net/alexjamesbrown/Zx5sR/" rel="nofollow">http://jsfiddle.net/alexjamesbrown/Zx5sR/</a></p>
