title: jquery changing list order based on class selected
body: <p>I have a set of tabs, the select list is stacked vertically, the selected item has class "selected". </p>
  
  <p>I need that item to be the last item in the list so it can also act as the header for the tab.</p>
  
  <p>so it appears something like this;</p>
  
  <pre><code>&lt;ul class= 'tabSelect'&gt;
   &lt;li&gt;item 1&lt;/li&gt;
   &lt;li&gt;item 3&lt;/li&gt;
   &lt;li&gt;item 4&lt;/li&gt;
   &lt;li class="selected"&gt;item 2&lt;/li&gt;
  &lt;/ul&gt;
  &lt;div id="tab1" style="display:none"&gt;
  &lt;div id="tab2"&gt;
   item 2 content....
  &lt;/div&gt;
  </code></pre>
  
  <p>etc</p>
  
  <p>how do I do this in jquery</p>
  
  <p>the page is <a href="http://www.businessexcellencebristol.co.uk/category/members" rel="nofollow">www.businessexcellencebristol.co.uk/category/members</a></p>
  
  <p>oh, and thank you!</p>