title: JQuery remove() current table column by anchor rel
body: <p>I have a table with a delete link in the thead, when this link is clicked I want to remove the whole column (and fade out) including the tbody.</p>
  
  <p><strong>Example of table:</strong></p>
  
  <pre><code>&lt;table class="example" id="dnd-example"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Column A &lt;a href="" class="delsite" rel="1"&gt;x&lt;/a&gt;&lt;/th&gt;
              &lt;th&gt;Column B &lt;a href="" class="delsite" rel="2"&gt;x&lt;/a&gt;&lt;/th&gt;
              &lt;th&gt;Column C &lt;a href="" class="delsite" rel="3"&gt;x&lt;/a&gt;&lt;/th&gt;
          &lt;/tr&gt;
      &lt;tbody&gt;
          &lt;td&gt;213&lt;/td&gt;
          &lt;td&gt;213&lt;/td&gt;
          &lt;td&gt;213&lt;/td&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p><strong>Code</strong> I've tried to adapt some I used for removing a row by changing the tr to td but its not working for columns.</p>
  
  <pre><code>$(".delsite").click(function() { 
      var id =$(this).attr('rel');
      $(this).closest('td').fadeOut("normal", function() { $(this).remove(); });
      //
      //
  });
  </code></pre>