How to dynamically add a new column to an HTML table

Question

I have a table to which I am currently dynamically adding rows: http://jsfiddle.net/fmuW6/5/

Now I\'d like to add a new column to the table as well with a click of a

Answer 1

The answer works, but still here is an alternative way where we use thead and tbody !

JS

$('#irow').click(function(){
if($('#row').val()){
    $('#mtable tbody').append($("#mtable tbody tr:last").clone());
    $('#mtable tbody tr:last :checkbox').attr('checked',false);
    $('#mtable tbody tr:last td:first').html($('#row').val());
}
});
$('#icol').click(function(){
if($('#col').val()){
    $('#mtable tr').append($(""));
    $('#mtable thead tr>td:last').html($('#col').val());
    $('#mtable tbody tr').each(function(){$(this).children('td:last').append($(''))});
}
});