Quick x * y table

xytable.css

*
{
    margin: 0;
    padding: 0;
}

html, body
{
    width: 100%;
    height: 100%;
    font-family: Roboto, Consolas, Courier New, Tahoma, Arial;
}

#grid
{
    width: 400px;
    height: 400px;
    border-spacing: 4px;
    position: absolute;
    left: 75px;
    top: 75px;
}

#grid td
{
    border: 1px solid black;
    background-color: rgba(52, 152, 219, 0.6);
}

xytable.html

<table id = "grid">
    
</table>

xytable.js

var $grid = $('#grid');
var rows = 10;
var cols = 10;

var rowsncols = '';

for(var i = 0; i < rows; i++)
{
    rowsncols += '<tr>';
    
    for(var j = 0; j < cols; j++)
    {
        rowsncols += '<td>&nbsp;</td>';
    }
    
    rowsncols += '</tr>';
}

$grid.append(rowsncols);