Why is my thead not appearing in Internet Explorer?

I have made a table with a thead (header); on a Mac, and in Firefox everything is fine, but on Internet Explorer 6 the head is just gone...

Any idea why?

Here is the link to test it: http://www.acecrodeo.com/new/05-rodeos.php... The table is constructed in tablerize.js:

jQuery.fn.tablerize = function() {
    return this.each(function() {
        var table;
        $(this).find('li').each(function(i) {
            var values = $(this).html().split('*');
            if(i == 0) {
                table = $('<table>');
                var thead = $('<thead>');
                $.each(values, function(y) {
                    thead.append($('<th>').html(values[y]));
                });
                table.append(thead);
            } else {
               var tr = $('<tr>');
               $.each(values, function(y) {
                   tr.append($('<td>').html(values[y]));
               });
               table.append(tr);
            }
        });
        $(this).after(table).remove();
    });
};

...from a list on the page:

<ul>

<li>&nbsp; Date*Endroit*Sanction</li>
<li>&nbsp; 29 Mars &amp; 5 Avril*St-&Eacute;variste, Beauce&nbsp; # 1*&Eacute;quipe Rod&eacute;o du Qc.</li>
<li>&nbsp; 12 &amp; 19 Avril*St-&Eacute;variste, Beauce&nbsp; # 2*&Eacute;quipe Rod&eacute;o du Qc.</li>
<!-- ... -->
</ul>

From stackoverflow

• You're including <th> elements directly in the <thead> group; that's not actually legal. You must enclose them in a <tr> element, and put that in the <thead>...

  See: 11.2.3 Row groups: the THEAD, TFOOT, and TBODY elements

  So modify jQuery.fn.tablerize()to insert a <tr> within the <thead> before appending the <th> elements:

  table = $('<table>');
  var thead = $('<thead>');
  var headRow = $('<tr>');
  $.each(values, function(y) {
        headRow.append($('<th>').html(values[y]));
     });
  thead.append(headRow);
  table.append(thead);
  

  Note that you're also omitting the <tbody> element; you should probably put the rest of the rows in one of those as well.

• nope !..

  no starting and a bizzare ending

  lets add the tbody... where ?

• Well since I'm the author of tablerize I might as well fix it.

  jQuery.fn.tablerize = function() {
   return this.each(function() {
    var table = $('<table>');
    var tbody = $('<tbody>');
    $(this).find('li').each(function(i) {
     var values = $(this).html().split('*');
     if(i == 0) {
      var thead = $('<thead>');
      var tr = $('<tr>');
      $.each(values, function(y) {
       tr.append($('<th>').html(values[y]));
      });
      table.append(thead.append(tr));
     } else {
        var tr = $('<tr>');
        $.each(values, function(y) {
         tr.append($('<td>').html(values[y]));
        });
        tbody.append(tr);
     }
    });
    $(this).after(table.append(tbody)).remove();
   });
  };
  

  That should do it.

  Shog9 : ++Nice, Paolo - way to stand behind your work. :-)

• cool, everything seem fine now... great help thanks

  what a tbody add to my table ?