можно так
<!DOCTYPE HTML>
<html>
<head>
<style>
table {border: 1px solid;}
td {padding: 5px; cursor: pointer;}
.red { color: red; }
.green { color: green; }
.blue { color: blue; }
.red .red,
.green .green,
.blue .blue { background: silver}
</style>
</head>
<body>
<table>
<tr><td class=red>red</td><td class=green>green</td><td class=blue>blue</td></tr>
<tr><td class=green>green</td><td class=red>red</td><td class=blue>blue</td></tr>
<tr><td class=red>red</td><td class=blue>blue</td><td class=green>green</td></tr>
</table>
<script>
document.querySelector('table').onmouseover = function (e) {
this.className = e.target.className;
}
</script>
</body>
</html>