JSFiddle - React, Tailwind, and code Playground

HTML

<table>
  <tr>
  <td>1,7,9,4,8</td>
  <td>7,11,89,12,8</td>
  </tr>
<table>

CSS

table td{border:1px solid #000;padding:10px;width:50%;}
table{border-collapse:collapse;width:100%; }
.light{background:red;}

JavaScript

$("td").each(function(){
	$(this).html("<span>"+$(this).text().replace(/,/g,"</span>,<span>")+"</span>");  
});


$(document).on("click","span",function(){
	$(".light").removeClass("light");
	var i = $(this).index();
  var q = $(this).parent().prev().length>0?$(this).parent().prev():$(this).parent().next();
  $(this).addClass("light");
  q.children().eq(i).addClass("light");
});