styles.css

making the letters look better:

.row {
  display:flex;
}
.square {
  width:5vmin;
  height:5vmin;
  font-size:4vmin;
  text-align:center;
}

When the player clicks on one of the squares, the square_clicked function should highlight that square and remember it.

So set up a globals.js file with:

var g_square_id=0;

and a functions.js file for :

function highlight(id) {

function highlight(id) {
  var el=document.getElementById(g_square_id);
  el.style.backgroundColor='white';
  var el=document.getElementById(id);
  el.style.backgroundColor='palegreen';
  g_square_id=id;
}
index.html
  <script>
    load_squares(g_sets[0]);
    highlight(0);
  </script>
</body>
</html>