Checking whether the clicked column is first in the row or not

Question

wanted a Jquery code to check whether the clicked column is first in the Row or not.

A table is being used for selecting certain options. And onclick, the background of the clicked td is shown (A tick Mark) by assigning a CSS class using jquery and removing that class from all the sibling td elements (one selection per row).

The issue is that it should not do this on clicking the first column as it contains the Labels for the option/question .

the current code is as follows:

  $(document).ready(function () {
    $("table tr td").click(function () {
        $(this).parent().find('td').each(function () {
            $(this).removeClass("CheckMark");
        });
        $(this).addClass("CheckMark");
    });
});

If the column is first, no action should be performed as it contains the Labels for option .

Hope to have explained the situation adequately :).

Kind regards, A.Ali

Answer 1

Use index() to find out first column on click of td. If index() gives zero then it will be first column as index() gives zero-based index.

$(document).ready(function () {
    $("table tr td").click(function () {

        if($(this).index() == 0) return;    

        $(this).parent().find('td').each(function () {
            $(this).removeClass("CheckMark");
        });
        $(this).addClass("CheckMark");
    });
});