1. Use jQuery to detect when any of the buttons are clicked and trigger a handler function.

2. Inside the handler, create a new variable called userChosenColour to store the id of the button that got clicked.

--> So if the Green button was clicked, userChosenColour will equal its id which is "green".

3. At the top of the game.js file, create a new empty array with the name userClickedPattern.

4. Add the contents of the variable userChosenColour created in step 2 to the end of this new userClickedPattern

At this stage, if you log the userClickedPattern you should be able to build up an array in the console by clicking on different buttons.

Note: If you need any hints, try scrolling down. 👇


















Hint 1A. Remember that all the buttons share the same class (btn).

Hint 1B. Remember that jQuery has a .click() function: https://api.jquery.com/click/

Hint 1C. jQuery handlers are anonymous functions: https://api.jquery.com/click/#click-handler

Hint 2A. Inside the handler, you can use the keyword this to refer to the button object that triggered the click.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this

Hint 2B. You can use the attr() function in jQuery to find out the value of any of the attributes of an object. https://api.jquery.com/attr