title: jQuery: insert a <li> tag into a list in order
body: <p>I have an order of <code>&lt;li&gt;</code> tags:</p>
  
  <pre><code>var order = ["a-link", "b-link", "c-link", "d-link", "e-link", "f-link"];
  </code></pre>
  
  <p>Some of the <code>&lt;li&gt;</code> tags might or might not be on the list at any given moment:</p>
  
  <p>i.e.</p>
  
  <pre><code>&lt;ul&gt;
  &lt;li id="a-link"&gt;&lt;/li&gt;
  &lt;li id="d-link"&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I would like to be able to say, insert a <code>&lt;li&gt;</code> tag in it's right order...</p>
  
  <pre><code>    &lt;ul&gt;
          &lt;li id="a-link"&gt;&lt;/li&gt; 
  &lt;!-- i'd like to insert &lt;li id="b-link"&gt; right after this --&gt;
          &lt;li id="d-link"&gt;&lt;/li&gt;
      &lt;/ul&gt;
  </code></pre>
  
  <p>Sometimes my list might look like this:</p>
  
  <pre><code>    &lt;ul&gt;
      &lt;li id="b-link"&gt;&lt;/li&gt;
  
  &lt;!-- but maybe I want to insert a &lt;li id="d-link"&gt; here--&gt;
  
      &lt;li id="e-link"&gt;&lt;/li&gt;
      &lt;/ul&gt;
  </code></pre>
  
  <p>Or like this:</p>
  
  <pre><code>    &lt;ul&gt;
      &lt;li id="a-link"&gt;&lt;/li&gt;
      &lt;li id="d-link"&gt;&lt;/li&gt;
  &lt;!-- but maybe I want to insert a &lt;li id="e-link"&gt; here--&gt;
      &lt;li id="f-link"&gt;&lt;/li&gt;
      &lt;/ul&gt;
  </code></pre>
  
  <p>Basically, the list might change...but whenever I want to insert a <code>&lt;li&gt;</code> tag (one at a time) it needs to be placed in the right order as the order array.</p>