Brain Age Excercise

We now start to mix our JavaScript with DOM manipulation. For this exercise you will implement a version of one of the games from the Brain Age game (no I don't get a kickback if you buy one). Our version will be slightly different from the one shows in the screenshot; instead of drawing a ling from circle to circle, the user will click on every box in turn. The game follows these steps:

1. You display the set of numbers 0 thru 9 and the set of letters A thru J, each one in a box and each one in a random location. Make sure that they all fit within the viewable window. Make sure that none of the boxes overlap.
2. The game then begins, you will show a clock that counts the number of seconds that have elapsed. The clock is updated every second.
3. The user must click on the boxes in the order A, 1, B, 2, C, 3.... When he gets to 9 the clock stops and the game ends.
4. If the user clicks on a wrong box, say A then B, you will make the background of the box red, for one second, then turn it back to transparent. Also, 3 seconds will be added to the clock for every wrong click.

One thing you will need to use is the onclick attribute, which we have not discussed yet. Just note that you can add this attribute to an a as follows:
<a href="..." onclick="javascriptFunction()">.