index.js

const buttonColours = ["red", "blue", "green", "yellow"]; 
let gamePattern = [];
let userClickPattern = [];
let level = 0;
let start = false;

const title = document.getElementById("level-title");

document.addEventListener("keydown", function() {
    if(!start) {
        title.textContent = "Level " + level;
        nextSequence();
        start = true;
    }
})

const btn = document.querySelectorAll(".btn");

btn.forEach((btn) => {
    btn.addEventListener("click", function() {
        const userChosenColor = btn.id;
        userClickPattern.push(userChosenColor);

        animatePress(userChosenColor);
        playSound(userChosenColor);
        checkAnswer(userClickPattern.length-1);
    });
})

// aminmate flash color when clicking
function flash(color) {
    // $("#" + randomChosenColour).fadeIn(100).fadeOut(100).fadeIn(100);
    const el = document.getElementById(color);
    el.animate(
        [{opacity:1}, {opacity:0}, {opacity:1}],
        {duration: 300, easing: "Linear" }
    );
}

function nextSequence() {

    userClickPattern = [];

    level++;
    title.textContent = "Level " + level;

    let randomNumber = Math.floor(Math.random()*4);  
    let randomChosenColour = buttonColours[randomNumber];

    // generate and random color and flash
    gamePattern.push(randomChosenColour);

    flash(randomChosenColour);
    playSound(randomChosenColour);

    console.log("game:" + gamePattern); 
}

function playSound(name){
    let audio = new Audio("sounds/" + name + ".mp3");
    audio.play();
}

function animatePress(colour) {
    const el = document.getElementById(colour);
    el.classList.add("pressed");
    setTimeout(function () {        
        el.classList.remove("pressed");
    }, 100);    
}

function checkAnswer(currentLevel) { 
    if (userClickPattern[currentLevel] === gamePattern[currentLevel]) {
        
        console.log("success");
        if (userClickPattern.length === gamePattern.length) {
            setTimeout(function(){
                nextSequence(); 
            }, 1000);
         };
    }
    else {
        console.log("wrong");
        playSound("wrong");

        document.querySelector("body").classList.add("game-over");
        setTimeout( function() {
            document.querySelector("body").classList.remove("game-over");
        }, 200);
        title.textContent = "Game Over, Press Any key to Restart";
        startOver();
    }
}

function startOver() {
    level = 0;
    gamePattern = [];
    start = false;
}