how to make a dinamic grid with JavaScript?

I am new to javascript, and I’m trying to create a grid of 5 by 5 blocks dinamically and each one has to have a unique ID.

I tried to create a 5×5 grid of blocks dynamically in JavaScript and assign each block a unique ID. I was expecting each block to be displayed on the page and have a unique ID, but I don’t see the blocks on the page. I’m not sure what I’m doing wrong

function createGrid() {
    let grid = document.createElement('div');
    grid.style.display = 'grid';
    grid.style.gridTemplateColumns = 'repeat(5, 1fr)';
    grid.style.gridTemplateRows = 'repeat(5, 1fr)';

    for(let i = 0; i < 25; i++) {
        let block = document.createElement('div');
        block.id = 'block' + i;
        grid.appendChild(block);
    }

    document.body.appendChild(grid);
}

createGrid();