JSFiddle - React, Tailwind, and code Playground
HTML
<body>
<button class="TableButton">
<img onclick="a();" class="ProgressButton" src="../images/KEY04.ICO">
</button>
<div id="ProgressTable">
<table border="1">
<tr>
<td></td>
<th>Name1</th>
<th>Name2</th>
<th>Name3</th>
<th>Name4</th>
<th>Name5</th>
</tr>
<tr class="TableTr1">
<th>THISTH</th>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr class="TableTr2">
<th>THISTH</th>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr class="TableTr3">
<th>THISTH</th>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr class="TableTr4">
<th>THISTH</th>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
</table>
</div>
</body>
CSS
#ProgressTable{
margin: 10px;
}
#ProgressTable table{
font-size: 10px;
}
#ProgressTable table tr td{
text-align: center;
}
.TableButton{
height: 36px;
width: 36px;
padding: 0;
position: fixed;
right: 5%;
top: 1px;
cursor: pointer;
}
JavaScript
function random(){
var Mark=0;
while (Mark < 3){
Mark=Math.round(Math.random()*5);
}
var str = "<td>" + String(Mark) + "</td>";
return str;
}
function changeMarks(){
$(".TableTr" + i ).html(random());
}
function a(){
var i=1;
var j=1;
while (i < 5){
while (j < 6){
changeMarks();
j++;
}
j=1;
i++;
}
}