Error getting the row index of a clicked table in jQuery
===

I'm trying to get the row number of the table item I'm clicking on. I thought this would work but I'm getting an error saying "Object doesn't support property or method 'parent'" What am I doing wrong? The table is dynamically created so that's why I'm specifying it through a css class.

    <script type="text/javascript">
        var table = $('<table></table>');
           $(document).ready(function () {
           $(".tbl").click(
                 function () { var row = $('<tr></tr>').text($(this).index);
                               table.append(row); 
                               $('#please').append(table);}
            );
        }); 
    </script> 