How to highlight only certain table rows with jQuery?

[leongaban]

So I found Chris’s awesome tutorial here, and used it to create my Codepen below:
https://css-tricks.com/row-and-column-highlighting/

My Codepen
http://codepen.io/leongaban/pen/nJzcv

My problem is that in my real project I do not want to highlight certain rows. I tried to used class names, but to no effect :(

How would you go about this?

//Row Highlighting
$(“table .active”).delegate(‘td’,’mouseover mouseout’, function(e) {
if (e.type == ‘mouseover’) {
console.log(‘hovering over row’);
$(this).parent().addClass(“gray-rollover”);
}
else {
$(this).parent().removeClass(“gray-rollover”);
}
});

// Works but highlights all Rows
/*$(“table”).delegate(‘td’,’mouseover mouseout’, function(e) {
if (e.type == ‘mouseover’) {
console.log(‘hovering over row’);
$(this).parent().addClass(“gray-rollover”);
}
else {
$(this).parent().removeClass(“gray-rollover”);
}
});*/

[leongaban]

Found solution!
http://stackoverflow.com/questions/17201408/how-to-highlight-certain-table-rows-using-jquery/17201474?noredirect=1#17201517

Needed to use thead and tbody to separate the rows

$(“table > tbody”).delegate(‘td’,’mouseover mouseout’, function(e) {

[Author]

Posts