script.js

const gameContainer = document.getElementById('game-container');
const scoreDisplay = document.getElementById('score-display'); // spelling fix
const colors = ['red', 'blue', 'green', 'yellow'];
let score = 0;

function createColorBox(color) {
    const box = document.createElement('div'); 
    box.classList.add('color-box');
    box.style.backgroundColor = color;
    box.addEventListener('click', checkColor);
    gameContainer.appendChild(box);
    return box;
}

function checkColor(event) {
    const clickedBox = event.target;
    const randomColor = colors[Math.floor(Math.random() * colors.length)]; // () fix
    if (clickedBox.style.backgroundColor === randomColor) {
        score++;
        scoreDisplay.textContent = `Score: ${score}`; // template fix
        alert(`YAY! You matched the color! 🎉`);
    } else {
        alert(`Oops! The color was ${randomColor}. Try Again 😊`);
    }
}

for (let i = 0; i < colors.length; i++) { // length spelling fix
    createColorBox(colors[i]);
}