JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="//cdn.datatables.net/1.10.5/css/jquery.dataTables.min.css">
<table id='test'>
	<thead>
		<tr>
			<th>User</th>
			<th>Number</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>john</td>
			<td>50</td>
		</tr>
		<tr>
			<td>Greg</td>
			<td>40</td>
		</tr>
		<tr>
			<td>Handy</td>
			<td>30</td>
		</tr>
		<tr>
			<td>Bill</td>
			<td>5</td>
		</tr>
		<tr>
			<td>Paris</td>
			<td>80</td>
		</tr>
		<tr>
			<td>Gildas</td>
			<td>48</td>
		</tr>
		<tr>
			<td>Karim</td>
			<td>20</td>
		</tr>
		<tr>
			<td>Annis</td>
			<td>41</td>
		</tr>
	</tbody>
</table>

JavaScript

$(document).ready(function(){
    var table = $('#test').DataTable({
        order: [1,'desc']
    });
   
    
    $("#test tbody").on("click","td",function(){
         var d = parseInt(table.cell( this ).data());
         d = d+1;
         table.cell(this).data(d).draw();
    })
    
});