Tengo una variable llamada grid que contiene variables llamadas elementos.

Al hacer clic en un botón, me gustaría eliminar la cuadrícula y reemplazarla por una nueva. Esto se hace a través de un detector de eventos, una función y una instrucción if.

Sin embargo, recibo un error de consola que me dice "la cuadrícula no está definida".

¿Alguien puede ayudar?

 //Create preset variables let body = document.querySelector('body'); let content = document.querySelector('.content'); let numberOfSquares = 16; let randomColorValue = ''; let colorShade = 10; let buttonClicks = 0; /* let grid = document.createElement('div'); */ //Create variable called container that contains a div let container = document.createElement('div'); container.classList.add('container'); body.appendChild(container); // Add a button & position to top of screen let button = document.createElement('button'); button.textContent = "Refresh!"; button.classList.add('refresh-button'); content.appendChild(button); button.addEventListener('click', refreshGrid); squaresInGrid(); function squaresInGrid() { if (buttonClicks > 0) { console.log(buttonClicks); container.removeChild(grid); } for (i = 0; i < numberOfSquares; ++i) { let grid = document.createElement('div'); grid.classList.add('grid'); container.appendChild(grid); let element = document.createElement('div'); element.classList.add('grid-item'); element.addEventListener('mouseenter', function mouseEnterFunctions() { randomColor(); hoverStyle(); --colorShade; element.removeEventListener('mouseenter', mouseEnterFunctions); }); function hoverStyle() { element.style.backgroundColor = '#'+randomColorValue; element.style.opacity = (colorShade / 10); } function randomColor() { randomColorValue = Math.floor(Math.random()*16777215).toString(16); } grid.appendChild(element); } } //Function to be called on button click removing existing grid and replacing with a new one function refreshGrid() { ++buttonClicks; numberOfSquares = prompt("How many squares would you like? (Maximum 100)"); colorShade = 0; squaresInGrid(); }