title: Ordering DIVs based on class name using Javascript/Jquery
body: <p>I have the following HTML structure:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div&gt;1&lt;/div&gt;
      &lt;div class="red"&gt;2&lt;/div&gt;
      &lt;div class="red"&gt;3&lt;/div&gt;
      &lt;div&gt;4&lt;/div&gt;
      &lt;div&gt;5&lt;/div&gt;
      &lt;div class="red"&gt;6&lt;/div&gt;
      &lt;div&gt;7&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I wast to run some Jquery that will sort the divs inside the div container by ordering the divs <em>first</em> that have class="red", and then those that don't, so the final structure should be:</p>
  
  <pre><code>&lt;div id="container"&gt;
      &lt;div class="red"&gt;2&lt;/div&gt;
      &lt;div class="red"&gt;3&lt;/div&gt;
      &lt;div class="red"&gt;6&lt;/div&gt;
      &lt;div&gt;1&lt;/div&gt;
      &lt;div&gt;4&lt;/div&gt;
      &lt;div&gt;5&lt;/div&gt;
      &lt;div&gt;7&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Help? Thanks.</p>