Add ending tag and start tag

jquery

Solution

try this:

$('<table id="sec" cellspacing="0" cellpadding="0" width="930"><tbody><tr></tr></tbody></table>').insertAfter('table');

var s = $('#menu td').size() / 2;

$('#menu td').each(function(){
    if($(this).index() > s) {
      $(this).clone(true).appendTo("#sec tr");
      $(this).remove()
    }
})

http://jsfiddle.net/39pLc/4/

Problem

I have a table: ``` <div id="menu"> <table cellspacing="0" cellpadding="0" width="930"> <tbody> <tr> <td> 1 </td> <td class="spacer"></td> <td> 2 </td> <td class="spacer"></td> <td> 3 </td> <td class="spacer"></td> <td> 4 </td> <td class="spacer"></td> <td> 6 </td> <td class="spacer"></td> <td> 5 </td> </tr> </tbody> </table> </div> ``` And I need to split this table into two tables. Like this: ``` <div id="menu"> <table cellspacing="0" cellpadding="0" width="930"> <tbody> <tr> <td> 1 </td> <td class="spacer"></td> <td> 2 </td> <td class="spacer"></td> <td> 3 </td> </tr> </tbody> </table> <table> <tbody> <tr> <td> 4 </td> <td class="spacer"></td> <td> 6 </td> <td class="spacer"></td> <td> 5 </td> </tr> </tbody> </table> </div> ``` So I did this: It finds the middle spacer and replaces that with some ending tags and start tags. ``` var menuItems = jQuery('#menu table tr td.spacer').size(); var middle = Math.floor(menuItems/2); jQuery('#menu table tr').children('td.spacer').each(function(index) { if(index == middle) { jQuery(this).replaceWith('</tr></tbody></table><table><tbody><tr>'); } }); ``` But jQuery doesn't seem to like that... Is it possible to do this? Split an element?

Original source