title: How to swap two sets of rows in a table
body: <p>I have two sets of rows in a table selected:</p>
  
  <pre><code>var slice1 = $( table ).children( "tr" ).slice( i - rowsPerItem, i );
  var slice2 = $( table ).children( "tr" ).slice( i, i + rowsPerItem );
  </code></pre>
  
  <p>Which I can highlight using css and verify are the correct rows. Now I want to swap their position in the parent table as a set. They two sets are always one after the other in the table and contain the same number of rows.</p>
  
  <p>Everything I've tried only moves one row:</p>
  
  <pre><code>$( slice1 ).after( slice2[slice2.length-1] );
  </code></pre>
  
  <p>How do I keep the sets or rows together, in the same order, but swap their position in the table?</p>
  
  <p>Here's an example of what I'm seeing: <a href="http://jsfiddle.net/5vBfA/" rel="nofollow">http://jsfiddle.net/5vBfA/</a></p>