Sort select list by count and value
<p>I have an html list</p>

<pre><code>&lt;select&gt;
  &lt;option value="w" count="1"&gt;w (1)&lt;/option&gt;
  &lt;option value="a" count="1"&gt;a (1)&lt;/option&gt;
  &lt;option value="d" count="5"&gt;d (5)&lt;/option&gt;
  &lt;option value="r" count="0"&gt;r (0)&lt;/option&gt;
  &lt;option value="q" count="0"&gt;q (0)&lt;/option&gt;
  &lt;option value="s" count="0"&gt;s (0)&lt;/option&gt;
  &lt;option value="b" count="5"&gt;b (5)&lt;/option&gt;
&lt;/select&gt;
</code></pre>

<p>I want the list to be order by <code>count</code> first, then by <code>value</code>.</p>

<p>Output:</p>

<pre><code>&lt;select&gt;  
  &lt;option value="b" count="5"&gt;b (5)&lt;/option&gt;
  &lt;option value="d" count="5"&gt;d (5)&lt;/option&gt;
  &lt;option value="a" count="1"&gt;a (1)&lt;/option&gt;
  &lt;option value="w" count="1"&gt;w (1)&lt;/option&gt;
  &lt;option value="q" count="0"&gt;q (0)&lt;/option&gt;
  &lt;option value="r" count="0"&gt;r (0)&lt;/option&gt;
  &lt;option value="s" count="0"&gt;s (0)&lt;/option&gt;
&lt;/select&gt;
</code></pre>

<p>I know how to sort by <code>count</code> OR by <code>value</code> but I don't find an easy way to combine them.</p>

<p>Sort by count:</p>

<pre><code>select.sort(function (a, b) {
    var c1 = parseInt($(a).attr('count'), 10);
    var c2 = parseInt($(b).attr('count'), 10);
    return c1 &lt; c2 ? 1 : c1 &gt; c2 ? -1 : 0;
});
</code></pre>

<p>and by value</p>

<pre><code>select.sort(function (a, b) {
    return $(a).text().toUpperCase().localeCompare($(b).text());
});
</code></pre>

<p>I am thinking about building an object:</p>

<pre><code>var map = {
    5: ['d', 'b'],
    1: ['a', 'w'],
    0: ['r', 'q', 's']
};
</code></pre>

<p>Then sort each keys:</p>

<pre><code>function keys(map) {
    var keys = [];
    for (var key in map) {
        if (map.hasOwnProperty(key)) map[key].sort();
    }
    return keys;
}

keys(map);
map;
</code></pre>

<p>And finally reconstruct the <code>select</code> list.</p>

<p>Is there an easier way?</p>
