Почему появляется ошибка underfined когда пытаюсь вывести ID у элемента TD?

Question

[Rouzi]

Не могу понять, в чем ошибка в этом коде:

var scene = document.getElementById("scene");
var gameArea = document.getElementById("gameArea");

function createMap(cols, rows){
    for(var i = 0; i < rows; i++){
        var rowBlock = document.createElement("tr");
        rowBlock.id = "block";
        gameArea.appendChild(rowBlock);
        for(var j = 0; j < cols; j++){
            var colBlock = document.createElement("td");
            colBlock.id = "cell";
            rowBlock.appendChild(colBlock);
        }
    }
}

createMap(5, 5);

var cells = document.querySelectorAll("#cell");


for(var i = 0; i < cells.length; i++){
    cells[i].addEventListener('click', function(){
        console.log(cells[i].id);
    })
}

Когда нажимаю на ячейку то вместо вывода id выпадает ошибка