title: Right align numeric values in a table and the <thead>
body: <p>Almost have it - picture a table with dynamic data - This works to right align date and numeric columns in a table But the kicker is I want to also right align the label column in the corresponding <code>&lt;thead&gt;&lt;th&gt;</code> column. If I understand the behind the scenes this method below goes one row at a time and if there's a match it applies <code>text-align:right</code> to the <code>&lt;td&gt;</code>. So If do this for every tr in the table that finds the regex match it will perform the <code>text-align: right</code> to the <code>&lt;th&gt;</code> which is overkill if I have 100 rows then wouldn't it attempt to do it 500 x. How do I perform this better to right align the label once on a regex match. </p>
  
  <pre><code>$('tr').each( function () 
  {
      // right align any numeric columns
      $(this).children('td:gt(0)').filter(function() 
      {
          return this.innerHTML.match(/^[0-9\s\.,]+$/);
      }).css('text-align','right');
  
      // right align any date columns in ddmmmyyyy format
      $(this).children('td:gt(0)').filter(function() 
      {
          return this.innerHTML.match(/\d{1,2}\w{3}\d{2,4}/);
      }).css('text-align','right');
  });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code> &lt;thead&gt;&lt;tr&gt;&lt;th&gt;Name&lt;/th&gt;&lt;th&gt;Age&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;
   &lt;tbody&gt;
   &lt;tr&gt;&lt;td&gt;Silly Me&lt;/td&gt;&lt;td&gt;29&lt;/td&gt;&lt;/tr&gt;
   &lt;tr&gt;&lt;td&gt;Not again&lt;/td&gt;&lt;td&gt;48&lt;/td&gt;&lt;/tr&gt;
   ....
   &lt;/tbody&gt;
  </code></pre>
  
  <p>So it will traverse the doc and on the 2nd row it sees a numeric column. So I want the  right align as well as the corresponding column on the  but let's only do this once to the  row.</p>
  
  <p>Make sense?</p>