JQuery: выделение/выделение строки таблицы по щелчку

Я хочу, чтобы мой script выделил строку, которую я выбрал, и она отлично работает, но когда строка выбрана/выделена, я хочу, чтобы она была "отменена/дефокусирована", если выбрана другая строка. Как это сделать?

Вот текущий код для выбора строки, он отменяет выбор, но только если я снова нажму на ту же строку:

$(".candidateNameTD").click(function() {
            $(this).parents("tr").toggleClass("diffColor", this.clicked);
        });

Таблица Html

<table id="newCandidatesTable">
    <thead>
        <tr>
            <th style="cursor: pointer;">ID</th>
            <th style="cursor: pointer;">Navn</th>
            <th style="cursor: pointer;">Email</th>
            <th></th>
        </tr>
    </thead>
    <tbody>
    <% foreach (var candidate in Model.Ansogninger)
    {
         %>
            <tr id="<%= candidate.AnsogerID %>" class="newCandidatesTableTr">
                <td><div id="candidateID"><%= candidate.AnsogerID %></div></td>
                <td><div id="<%= "candidateName_" + candidate.AnsogerID %>" class="candidateNameTD"><%= candidate.Navn %></div></td>
                <td><div id="candidateEmail"><%= candidate.Email %></div></td>
                <td>
                    <div id="<%= "acceptCandidateButton_" + candidate.AnsogerID %>" class="acceptb" style="cursor: pointer; border: 1px solid black; width: 150px; text-align: center;">Godkend</div>
                </td>
            </tr>
         <%
    } %>
    </tbody>
    </table>

Ответ 1

Вы можете сначала отменить выбор всех строк, например

    $(".candidateNameTD").click(function() {
        $(this).closest("tr").siblings().removeClass("diffColor");
        $(this).parents("tr").toggleClass("diffColor", this.clicked);
    });

edit: yep, sry, но идея была права;)

Ответ 2

$(".candidateNameTD").click(function() {
            $("tr").removeClass("diffColor");
            $(this).parents("tr").addClass("diffColor");
        });

Ответ 3

Это повлияет только на текущую таблицу:

$(".candidateNameTD").click(function() {
    $('table#newCandidatesTable tr').removeClass("diffColor");
    $(this).parents("tr").addClass("diffColor");
});

Ответ 4

Лучше всего использовать .live. Одно событие предпочтительнее многих (подумайте о большой таблице, больших накладных расходах).

$("div.candidateNameTD").live('click'. function() {
    var $tr = $(this).closest("tr");
    //remove any selected siblings 
    $tr.siblings().removeClass('diffColor');
    //toggle current row
    $tr.toggleClass('diffColor');         
});