title: Detaching and attaching
body: <p>I have the following:</p>
  
  <pre><code>$('th').click(function() {
      var $th = $(this);
      var column = $th.index();
      var $table = $th.closest('table');
      var rows = $table.find('tbody &gt; tr').get();
      rows.sort(function(rowA,rowB) {
          var keyA = $(rowA).children('td').eq(column).text().toUpperCase();
          var keyB = $(rowB).children('td').eq(column).text().toUpperCase();
          if (keyA &lt; keyB) return -1;
          if (keyA &gt; keyB) return 1;
          return 0;
      });
      $.each(rows, function(index,row) {
        $table.children('tbody').append(row);
      });
  });
  </code></pre>
  
  <p>I think it would execute faster if I detached the tbody before sorting it and then attached it back. </p>
  
  <p>Q: How do I use detach and attach to correctly move tbody in and out of the DOM?</p>