ajuste de columnas de tablas

Mediante Jquery ajustamos las columnas de dos tablas

by jpeter06

HTML

<div style="width:100%">
<table border=1 id="headerTable"><tr>
<td>aaaaaaaaaaaa  aaaaaaaaaaaa</td>
<td>bbbbbbbbbbbbbbbbb  bbbbbbbbbbbbbbb</td>
<td>ccccccc</td>
<td>dd</td>
</tr></table>
<table border=1 id="dataTable"><tr>
<td>aaaaa</td>
<td>bbbb</td>
<td>ccccccccccccccccccccc  ccccc</td>
<td>dddddddd</td>
</tr></table>
</div>

JavaScript

$(document).ready(function() {
    var w_header = [];
    var td_header = [];

    $('#headerTable tr:first-child td').each(function() {
        var width = $(this).width();
        w_header[w_header.length] = width;
        td_header[td_header.length] = $(this);
    });

    var cont = 0;
    $('#dataTable tr:first-child td').each(function() {
        var width = $(this).width();
        if (w_header[cont] < width) td_header[cont].width(width);
        else $(this).width(w_header[cont]);
        cont = cont + 1;
    });
});