jquery подчертават всяка втора реда на таблицата - jquery, row, highlight

Здравейте момчета Току-що започнах с jquery, Чудя се как да се реши този проблем:

Опитвам се да маркирам всеки ред в таблицата, като кликнем върху квадратчето, всичко е наред, с изключение на това, че само всеки втори ред е маркиран.

    $("tr").on("click",":checkbox", function () {
if($(this).is(":checked")) {
$(this).closest("tr").addClass("highlighted");
} else {
$(this).closest("tr").removeClass("highlighted");
}

Намерих тази прикачена css връзка причинява този проблем. За съжаление не мога да го игнорирам. Опитах се да превключвате, но без успех.

Как мога да маркирам всеки контролиран ред в таблица с използване на гореспоменатия css файл?

Отговори:

Изглежда, че чист-апи, има по-високо предимство .pure-table-striped tr:nth-child(2n-1) td{} който настройва цвета на фона, така че вашето правило е заменено с това правило. Решението е да прецизирате правилото си

.highlighted, .pure-table-striped tr.highlighted td {
background-color: rgba(0, 255, 0, 0.7);
}

Демонстрация: цигулка

Можете ли да публикувате всички правила от вашия css stylesheet, които могат да повлияят на изобразяването на редове на вашата страница?

Ако имате някакъв код, който да даде even / odd клас към всеки ред, един начин да има highlighted правилото се прилага с по - висок приоритет от even / odd правило е да го посочите два пъти, напр. :

//replace
tr.highlighted { background-color: purple }

//with
tr.even.highlighted, tr.odd.highlighted { background-color: purple }