onclick of td change td css

Question

<div id="divScroll" style="overflow-x: hidden">
                    <asp:UpdatePanel ID="updatePanelTableAppointment" runat="server">
                        <ContentTemplate> <table border="1" id="myTable">
    <tr class="csstr">
    <td class="csstdgreen" rowspan="3">
        john
    </td>
    </tr>
</table>
</asp:UpdatePanel>  </div>

Above is my html i have to check in jquery onclick of table td if td has class csstdgreen and rowspan is not null then i have to make that td having csstdgreen and having rowspan 1,2,3 etc then make it yellow.

How can i achieve with jquery

 $('#myTable td').click(function ()
                    {
                        if ($('td').hasClass("csstdgreen") && $('td').attr('rowspan'))
                        {
                            alert("Hi");
                            $('.csstdgreen').removeClass('csstdselected');
                            $('td').removeClass('csstdgreen').addClass('csstdselected');
                        }

                    });

Answer 1

Use the reference this to make changes to the targeted td :

$('#myTable td').click(function () {
    if ($(this).hasClass("csstdgreen") && $(this).attr('rowspan') )
    {
        alert("Hi");
        $('.csstdgreen').removeClass('csstdselected');
        $(this).removeClass('csstdgreen').addClass('csstdselected');
    }
});​

Demo