JSFiddle - React, Tailwind, and code Playground

HTML

<table border="1" cellspacing="1" cellpadding="5">
<thead>
    <tr>
        <th colspan="2"> HEAD GRID </th>
    </tr>
</thead>
<tbody>
    
</tbody>    
</table>

CSS

td{
    border:1px solid black;
    padding:5px;
}

JavaScript

//////////////////LOOP COLUMNS AND ROWS
var column =5;

for(a = 0; a < 13; a++){
   $('tbody').append('<tr>')
   for(i = 0; i < column; i++){
   $('tbody').append('<td>row ' + (1+a) + ', column '+ (1+i) + '</td>')
   }
   $('tbody').append('</tr>')
}

///Capture length collums
var cols = $('tbody').children('td').length;
$('th').attr('colspan', cols);