Piccola parentesi: non serve che tu quoti ogni post quando rispondi sul forum. Il "quote" dell'intero post è ridondante e crea solo confusione quando non è necessario. Puoi utilizzarlo se ti serve citare qualcosa di specifico a cui devi far riferimento, altrimenti è meglio utilizzare il semplice "Rispondi".

Bene, allora quello che ti servirà è creare un semplice documento html con l'implementazione di un po' di javascript.

Io ti consiglierei di ripartire da zero e andare a creare la struttura con semplice html. Puoi seguire grossomodo quanto hai già fatto ma con alcuni accorgimenti.

1 - Per ottenere un documento html valido è generalmente necessario inserire un doctype come prima riga (consulta qualche guida se non sai cos'è, ad esempio questa). Tieni presente che il doctype determina la versione di html del documento e quindi il tipo di sintassi da usare nella stesura del codice stesso.

Io direi che puoi utilizzare HTML5 per cui dovrai avere questo semplice doctype (come prima riga del documento):
codice:
<!DOCTYPE HTML>
2 - Inoltre è importante specificare il tipo di codifica dei caratteri che si intende utilizzare nel documento. In poche parole puoi inserire questa riga dentro il tag <head></head>:
codice:
<meta charset="utf-8">
3 - Controlla sempre la correttezza della tua struttura html. Dopo l'elemento head deve esserci il <body> e nient'altro. Nel tuo esempio hai fatto un grossolano errore racchiudendo il body dentro un div.

4 - Puoi partire da un modello html come questo:
codice:
<!DOCTYPE HTML>
<html>
  <head>
    <title>Esempio</title>
    <meta charset="utf-8">
    <script type="text/javascript">
      // qui ci sarà tutto il javascript
    </script>
  </head>
  <body>
     Qui devi inserire la tabella in semplice html che riproduce il tuo schema iniziale
  </body>
</html>
Ora sta a te costruire la tabella, più o meno come hai già fatto ma scrivendo con html pulito (senza le parti in php).
Appena hai pronta questa parte andiamo avanti.