HTML5 Game Development by Example(Second Edition)

Time for action – Showing the score of both players

We are going to create a text-based scoreboard and update the scores when either player scores a goal:

1. We are making improvements on our existing game so that we can use the last example as the starting point.
2. Open the index.html in the text editor. We are going to add the scoreboard's DOM elements.
3. Add the #scoreboard HTML structure to our #game DIV inside index.html. The #game DIV becomes the following:

   <div id="game"> <div id="playground"> <div class="paddle-hand right"></div> <div class="paddle-hand left"></div> <div id="paddleA" class="paddle"></div> <div id="paddleB" class="paddle"></div> <div id="ball"></div> </div> <div id="scoreboard"> <div class="score"> A : <span id="score-a">0</span></div> ...