title: Sort divs by price
body: <p>I have several products. Each has a specific price and I want a button to sort them by the price.</p>
  
  <p>The products are like this on my site:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="product" id="pr_1"&gt;Some Content&lt;/div&gt;
  &lt;div class="product" id="pr_2"&gt;Some Content&lt;/div&gt;
  &lt;div class="product" id="pr_3"&gt;Some Content&lt;/div&gt;
  ...
  </code></pre>
  
  <p>I parsed the prices from PHP to JavaScript so I have an JavaScript Object containing all prices and product ids:</p>
  
  
  
  <pre><code>{12:1, 20:2, 7:3}
  </code></pre>
  
  <p>Currently the key is the price and the value is the product's id.</p>
  
  <p>I want to have them reordered without reload. So JavaScript / jQuery only. I prefer plain JavaScript.</p>
  
  <p>Is there any way to change the order of the <code>div</code>s according to the prices of the products?</p>