I am very new to web development. I am currently using tablesorter jquery plugin to create a dynamic table, where the user can add and delete rows. I am having trouble with changing the background color of newly created rows upon clicking. It works fine with rows that are hard coded in html. Here is the relevant code:

$(document).ready(
    function() {
        $('table.tablesorter td').click(
            function (event) {
                $(this).parent('tr').toggleClass('rowclick');
                $(this).parent('tr').siblings().removeClass('rowclick');
        });
    }
)

rowclick is a css class here:

table.tablesorter tbody tr.rowclick td {
    background-color: #8dbdd8;
}

I have tried adding the following to my javascript function that adds a new row:

var createClickHandler = 
        function(newrow) {
            return function(event) {
                //alert(newrow.cells[0].childNodes[0].data);
                newrow.toggleClass('rowclick');
                newrow.siblings().removeClass('rowclick');
            };
        }
row.onclick = createClickHandler(row);

The alert correctly displays the text in the first column of the row when I click the new row. However, my new rows do not respond to the css class. Anyone have any ideas? Thanks in advance.