Adding a clickable class to a div (Simon game)


In my simon game I am trying to stop the user from being able to click on game buttons before turning the game on with a toggle switch.

To do this I tried making the simon game buttons into an onclick function linked to a class that I would only add to them once they turn the game on, so while the game is off the divs are just dead color divs that do nothing. I also gave this class a pointer cursor in css.

However, after turning the switch on I manage to get the pointer cursor working but my onclick function doesnt work. Would anyone know why?

my code to add the class on line 90 is

where color buttons is the predefined class for the red, yellow, green and blue color divs.

and my code for an onclick function is on line 28

Is it because “color-button-click” doesnt actually relate to anything when the page when its first loaded? Is this even possible to do? the class must be being added because in the css I have
cursor: pointer;
which makes the pointer appear after clicking on

Thanks to anyone that can help.

Just add an IF statement to each click handler, if the variable showing the toggle if the toggle is on or off don’t process the click. Something like:
if (toggle == on){ doCoolStuff(); } else { // Toggle is off, do nothing! }

1 Like

Well I feel like an idiot, it seems so obvious now. Thanks heaps.

1 Like

No problem, feel free to ask if you have further questions :slight_smile:

1 Like