How to add a new Row in a table with animation using jQuery?

Question

This is what i am doing to add new Row in table:-

function expandAll(){
        $('#myTableID>tbody>tr>td:nth-child(2)>div:nth-child(2)').each ( function() {
            html = $(this).html();
// Is it possible to add this Row with animation
            $(this).parent().parent().after( "<tr><td colspan='2'>&nbsp;</td><td colspan='15'>" + html + "</td></tr>" ).slideDown('slow');          
        } );
    }

I am able to add new Row, but there is no effect of using slideDown .

Answer 1

If you have JQuery 1.3.2, you can do this:

$("<your row html>").hide().insertAfter($(this).parent().parent()).slideDown('slow');