JSFiddle - React, Tailwind, and code Playground

HTML

<table id="tbl">
    <tr>
        <td>row 1 cell 1</td><td>row 1 cell 2</td>
    </tr>
    <tr>
        <td>row 2 cell 1</td><td>row 2 cell 2</td>
    </tr>
</table>

CSS

table, tr, td {
    border: solid 1px #444;
    border-collapse: collapse;
    color: white;
}

tr {
    background-color: #47F;
}

td {
    padding: 0 10px;
}

JavaScript

function onClick(evt) {
    
    var el = evt.target;
    if (el.tagName.toLowerCase() == "td") 
        el = el.parentNode;
    
    el.style.backgroundColor = "#F74";
    
}



document.getElementById("tbl").addEventListener("click", onClick);