title: Jquery - sort DIV's by innerHTML of children
body: <p>I've got html that looks something like this:</p>
  
  <pre><code>&lt;div id="sortThis"&gt;
  &lt;div id="1"&gt;Price:&lt;span class="price"&gt;20&lt;/span&gt;&lt;span class="style"&gt;blue&lt;/span&gt;&lt;/div&gt;
  &lt;div id="2"&gt;Price:&lt;span class="price"&gt;23&lt;/span&gt;&lt;span class="style"&gt;red&lt;/span&gt;&lt;/div&gt;
  &lt;div id="3"&gt;Price:&lt;span class="price"&gt;10&lt;/span&gt;&lt;span class="style"&gt;red&lt;/span&gt;&lt;/div&gt;
  &lt;div id="4"&gt;Price:&lt;span class="price"&gt;29&lt;/span&gt;&lt;span class="style"&gt;green&lt;/span&gt;&lt;/div&gt;
  &lt;div id="5"&gt;Price:&lt;span class="price"&gt;35&lt;/span&gt;&lt;span class="style"&gt;blue&lt;/span&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And I want to be able to sort by .price or by .style</p>
  
  <p>I suspect that this post partially answers my question: <a href="https://stackoverflow.com/questions/6133723/sort-divs-in-jquery-based-on-attribute-data-sort">Sort Divs in Jquery Based on Attribute &#39;data-sort&#39;?</a></p>
  
  <p>And this plugin comes close to doing what I need (since it can handle child attributes) but it does not seem to go as far as children's innerHTML: <a href="http://tinysort.sjeiti.com/" rel="noreferrer">http://tinysort.sjeiti.com/</a></p>
  
  <p>Any help will be appreciated by this noob.</p>