La griglia di caselle è realizzata con una table HTML in cui ciascuna casella è un elemento TD. Nella sezione STYLE dell'HEAD del file HTML si definiscono le caratteristiche delle caselle, definendo dimensioni (50x50px) e bordo.
Alle caselle viene associato un gestore per l'evento onclick. L'associazione è eseguita dalla funzione setHandlers() che viene chiamata al verificarsi dell'evento onload della pagina HTML (ovvero si esegue alla fine del caricamento del BODY della pagina in modo da essere sicuri che tutti gli elementi del DOM della pagina siano stati già allocati).
La funzione setHandlers() ottiene il riferimento a tutte le celle TD con document.getElementsByTagName("td") e, con un ciclo, assegna all'attributo onclick di ciascun elemento il riferimento alla funzione di gestione dell'evento changeColor().
Il gestore dell'evento changeColor(event) estrae dall'oggetto event il riferimento all'elemento (cella della griglia) in cui si è verificato (event.target) e legge l'attributo style.backgroundColor in modo da estrarre il colore corrente. In base al colore corrente si sceglie il nuovo colore secondo la sequenza assegnata (per default si mette "red") e si riassegna la nuova proprietà style.backgroundColor alla cella.