My table cells have a specific class structure: class="a", and/or class="b": class="a b".
This is the CSS:
.a {
background-color:blue;
}
.b {
background-color:green;
}
When the classes intersect, the color becomes green. I want to implement a functionality where when a user hovers over a table cell, all cells containing that class change to that color.
My current implementation is as follows:
$('td.a').add('td.b').hover(function() {
var myClassName = this.className;
$('td.' + myClassName).each(function() {
$(this).removeClass().addClass(myClassName);
});
});
The problem with this code is that it only works once because removeClass() is destructive.