JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<title>
Paint
</title>
<style>
 td.onmouseover {background-color:red};
 td.onmouseout {background-color:#ffffff;};
 td.onclick {background-color:blue;}
</style>
</head>
 <table width="50%" height="50%" border="3px">
  <tr>
   <td onmouseover="this.className='onmouseover'" onmouseout="this.className='onmouseout'" onclick="this.className='onclick'">1</td>
  </tr>
  <tr>
   <td onmouseover="this.className='onmouseover'" onmouseout="this.className='onmouseout'" onclick="this.className='onclick'">2</td>
  </tr>
  <tr>
   <td onmouseover="this.className='onmouseover'" onmouseout="this.className='onmouseout'" onclick="this.className='onclick'">3</td>
  </tr>
 </table>
</html>