JSFiddle - React, Tailwind, and code Playground

HTML

<table id="base">
    <tbody></tbody>
</table>

JavaScript

var base = document.getElementById('base'),
    tbody = base.getElementsByTagName('tbody')[0],
    numrows = 30,
    numcols = 10,
    col = 0,
    row = "<tr>{row}</tr>",
    rows = "",
    cell = "<td>{cell}</td>",
    cells = "";

// Remember el.attachEvent('onclick', ...) for IE8 and lower
base.addEventListener('click', function delegate(e){
    e.target.style.backgroundColor = 'blue';
});

while (numrows--) {
    cells = "";
    col = 0;
    
    while (col++ < numcols) {
        cells += cell.replace('{cell}', col);
    }
    
    rows += row.replace('{row}', cells);
}

tbody.innerHTML = rows;