Trying to understand java script.. The code provided prints out a game board of cells that are 10 x 10. I currnetly have it printed out so that it will print out pink squares. how can i create a click even on any of the pink squares that when they are clicked it will turn the square black... then any square that is black when it is clicked it will change back to the color pink

html/js code and css code is provided..

html/js code code ------------------------

Multiplayer Conway's Game of Life

var gameArrayLength = 10;

window.onload = function () { drawBoard();

}

//draw the initial game board function drawBoard() { var boardTable = document.getElementById("gameboard"); for (var i = 0; i

for (var j = 0; j

-------------------------------------------------------------------------------------------------------------------------------------------

css code

body { padding-top: 20px; padding-bottom: 20px; text-align: center; }

.body-content { padding-left: 15px; padding-right: 15px }

.gameboard-controls { background-color: #bbe0ff; border-bottom: 1px solid black; }

.gameboard-container { margin-left: auto; margin-right: auto; max-width: 600px; border: 5px solid black; border-radius: 7px; }

#gameboard { width: 100%; cursor: pointer; border-bottom: 2px solid black; border-top: 2px solid black; }

.cell { width: 14px; height: 12px; margin: 1px; border: 1px solid #e0e0e0; }

.cell-on { background-color: black; }

.cell-off { background-color: pink; }

.cell-queued { background-color: black; }

localhost52136/HtmiPagel.html Multiplayer Conway's Game of Life