Rahmen nur um ausgefüllte Zellen einer dynamisch erstellten Tabelle

[Rolf b]

Ich mach mal den Gunnar: Mit Spans wäre das nicht bedienbar.

Nimm Buttons, gib ihnen z.B. einen 2px Rand und mach sie per Margin und calc(100% + 1px) ein Pixel größer als die Tabellenzelle, so dass sich ihre Ränder überlappen. Sonst hast Du blöde Ecken im Layout.

Den Klick-Handler legst Du auf die Tabelle und prüfst, ob das event-Target ein Button ist, dann brauchst Du nur eine Registrierung.

for (let i=0; i<109; i++) {
   tabelle.rows[pse[i*6+3]].cells[pse[i*6+4]].innerHTML='<button>'+pse[i*6+1]+'</button>';
}
tabelle.addEventListener('click', function(ev) { 
   if (ev.target.tagName === "BUTTON")
      handleClick(this, ev.target.textContent)
};

table {
  border-collapse: collapse; 
  width: auto;
}

td {
  width: 2em; height: 2em; padding: 0;
  background-color: white;
}

button {
  margin: -1px -1px; padding: 0; width: calc(100% + 2px); height: calc(100% + 2px);
  border: 2px solid black;

}

Fiddle

Rolf