Add thead and insert first tr from tbody for parent table only

1
votes

I have to create a thead using the first row from a tbody. I don't have full control of the markup so I'm using jQuery to do this.

I have been successful using some borrowed script but when I add more than one table to a page the first row seems to be being duplicated across the following tables

I would imagine that I need to target the parent table, normally I would give each table an ID but I cannot as these are generated for me.

an example of what's happening can be seen on this fiddle http://jsfiddle.net/FGH6B/

My current jquery is as follows

jQuery("document").ready( function() {

    var mytable = $("table"); 

    mytable.prepend(document.createElement('thead'));

    $("table thead").append($("tbody tr:eq(0)"));

});
1
jqueryhtmlhtml-tablesemantic-markup
But in your fiddle, there is no parent table. – Anoop Joshi P
Sorry bad use of terminology. I meant the current table. – UntitledGraphic
so are you expecting the same output as Milind's answer? – Anoop Joshi P

1 Answers

5
votes

Try this:

$("document").ready( function() {
    $('table').each(function(){
    $(this).prepend('<thead></thead>')
    $(this).find('thead').append($(this).find("tr:eq(0)"));
})});

Working Demo