JQuery/Javascript Reordering rows
<p>I have a aspx page that looks something like this:</p>

<pre><code>&lt;tr id="Row1"&gt;
  &lt;td&gt;Some label&lt;/td&gt;
  &lt;td&gt;Some complex control&lt;/td&gt;
&lt;/tr&gt;
&lt;tr id="Row2"&gt;
  &lt;td&gt;Some label&lt;/td&gt;
  &lt;td&gt;Some complex control&lt;/td&gt;
&lt;/tr&gt;
&lt;tr id="Row3"&gt;
  &lt;td&gt;Some label&lt;/td&gt;
  &lt;td&gt;Some complex control&lt;/td&gt;
&lt;/tr&gt;
</code></pre>

<p>As soon as the page is loaded, I would want to reorder these rows based on the user's previously selected order (stored in a database)</p>

<p>How would I use JQuery/JS to accomplish this?</p>

<p>EDIT:</p>

<p>I have run into a performance issue with the appendTo code. It takes 400ms for a table of 10 rows which is really unacceptable. Can anyone help me tweak it for performance?</p>

<pre><code>function RearrangeTable(csvOrder, tableId)
{
  var arrCSVOrder = csvOrder.split(','); 

  //No need to rearrange if array length is 1
  if (arrCSVOrder.length &gt; 1)
  {
    for (var i = 0; i &lt; arrCSVOrder.length; i++)
    {
      $('#' + tableId).find('[fieldname = ' + arrCSVOrder[i] + ']').eq(0).parents('tr').eq(0).appendTo('#' + tableId);
    }
  }
}
</code></pre>
