JSFiddle - React, Tailwind, and code Playground

HTML

<table>
  <tr>
    <td><a href="#c11" id="c11"></a></td><td><a href="#c12" id="c12"></a></td><td><a href="#c13" id="c13"></a></td>
  </tr>
  <tr>
    <td><a href="#c21" id="c21"></a></td><td><a href="#c22" id="c22"></a></td><td><a href="#c23" id="c23"></a></td>
  </tr>
  <tr>
    <td><a href="#c31" id="c31"></a></td><td><a href="#c32" id="c32"></a></td><td><a href="#c33" id="c33"></a></td>
  </tr>
</table>

CSS

table{
	border-collapse: collapse;
	}
	
	td{
	border:1px solid black;
	height:50px;
	width:50px;
	text-align:center;   
	}
	
	a{
  display:block;
  height:49px;
	width:49px;
	
	text-decoration:none;
  }
	
a.horse:after,  
a:visited:after{
  content:"♘";
  font-size:3em; 
  color:red;
  }

JavaScript

$("a").bind("click", function(){
    $(this).toggleClass("horse");
    
    return false;
});