title: Switching order of HTML elements when layout changes in Responsive Web Design
body: <p>I am building a responsive website, and for good user experience, I need some layout changes from mobile to desktop. Specifically, I need to switch the order of some HTML elements.</p>
  
  <p>I need HTML elements be in a different order for desktop vs mobile. </p>
  
  <p><strong>Mobile</strong></p>
  
  <pre><code>&lt;div class="one"&gt;One&lt;/div&gt;
  &lt;div class="two"&gt;Two&lt;/div&gt;
  &lt;div class="three"&gt;Three&lt;/div&gt;
  </code></pre>
  
  <p><strong>Order switched for Desktop</strong></p>
  
  <pre><code>&lt;div class="one"&gt;One&lt;/div&gt;
  &lt;div class="three"&gt;Three&lt;/div&gt;
  &lt;div class="two"&gt;Two&lt;/div&gt;
  </code></pre>
  
  <p>This is simplified version of what I want to accomplish. I think it's called <a href="http://en.wikipedia.org/wiki/Progressive_enhancement" rel="noreferrer">progressive enhancement</a>. How do web design experts move html elements around? With JavaScript? Would it be normal? Are there any jQuery plugins?</p>