Return value of next span
<p>I'm trying to return the value of the next/closet span with a certain class ID. I am super close but I am confused how to use <code>next()</code> and <code>closest()</code> any help would be awesome </p>

<p>HTML:</p>

<pre><code>    &lt;table width="80%" cellspacing="0" cellpadding="0" &gt;
  &lt;th scope="col"&gt;Data&lt;/th&gt;
       &lt;tr&gt;
         &lt;td width="20%"&gt;&lt;a href="#" class ="show_data_link"&gt;Show Data&lt;/a&gt;
           &lt;span class="data"&gt;1 &lt;/span&gt;  
          &lt;/td&gt;
      &lt;/tr&gt;
           &lt;tr&gt;
         &lt;td width="20%"&gt;&lt;a href="#" class ="show_data_link"&gt;Show Data&lt;/a&gt;
           &lt;span class="data"&gt;2 &lt;/span&gt;  
          &lt;/td&gt;
      &lt;/tr&gt;
           &lt;tr&gt;
         &lt;td width="20%"&gt;&lt;a href="#" class ="show_data_link"&gt;Show Data&lt;/a&gt;
           &lt;span class="data"&gt;3 &lt;/span&gt;  
          &lt;/td&gt;
      &lt;/tr&gt;
 &lt;/table&gt;
</code></pre>

<p>JAVASCRIPT</p>

<pre><code>$('.show_data_link').bind('click', function(){
//returns the first class
alert($('.data').html());
//returns null
//alert($('.data').next().html());
//returns null
// alert($('.data').closest().html());
  return false;
});
</code></pre>

<p>If I use <code>$('.data').html()</code> i can get the value of the first span just not sure how to get the value of the span that is the closet so the link clicked 
<a href="http://jsfiddle.net/BandonRandon/nW4DJ/" rel="nofollow">JSFiddle</a></p>
