JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr><td></td><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td><td></td></tr>
    
</table>

CSS

table {
    table-layout:fixed;
    width:100%;
    height:300px;
    border-collapse:collapse;
}
td {
    border:1px solid black;
}
.hover {
    background:pink;
}

JavaScript

$('td').on('mouseover mouseout', function(){
                 $(this)
                 .add($(this).parent().parent()
                 .children()[$(this).index()]).toggleClass('hover');
          });