DOM - dynamische Erzeugung einer Verweisliste

[enrico]

Hallo und guten Abend,

ich stehe vor einem riesengroßen Problem, v.a. weil dies meine ersten Berühungspunkte mit DOM sind:

Ich will für meine DVD-Verwaltung folgende drei Filterfunktionen einbinden:

1) div "Ebene_Anfangsbuchstabe":
      Enthält einen Buchstabenindex aller Filmtitel

2) div "Ebene_Genre":
      Enthält alle Genres meiner Sammlung

3) div "Ebene_Altersfreigabe":
      Enthält alle Altersfreigaben meiner Sammlung

Bei allen drei div-Bereichen wird aber jeweils nur ein Vorkommen der Anfangsbuchstaben, Genres bzw.
der Altersfreigaben gespeichert.

Um die Filterung letztendlich auch durchführen zu können, habe ich ein drei versteckte Formularfelder
definiert:

<input type="hidden" name="Anfangsbuchstabe" value="">
   <input type="hidden" name="Genre"            value="">
   <input type="hidden" name="FSK"              value="">

Über eine - später noch einzubauende - Funktion werden die einzelnen Werte dann abgefragt und die
Filterung entsprechend ausgeführt.

Zurück zu meinem "Fall":

Der Buchstabenindex, die Liste der Genres und der Altersfreigaben sollen als Verweise in folgender
Art dynamisch in den HTML-Code eingebunden werden:

Hier am Beispiel der Erzeugung des Buchstabenindex:

<a href="javascript:void(0);"
      onClick="document.Filterparameter.Anfangsbuchstabe.value = Anfangsbuchstabe;this.blur();">

Wenn mein Index beispielsweise die Buchstaben "A", "D" und "J" enthalten sollte, dann soll der
div "Ebene_Anfangsbuchstabe" folgenden Aufbau haben:

<div id="Ebene_Anfangsbuchstabe">

<a href="javascript:void(0);"
         onClick="document.Filterparameter.Anfangsbuchstabe.value = 'A';this.blur();">
      </a>

<a href="javascript:void(0);"
         onClick="document.Filterparameter.Anfangsbuchstabe.value = 'D';this.blur();">
      </a>

<a href="javascript:void(0);"
         onClick="document.Filterparameter.Anfangsbuchstabe.value = 'J';this.blur();">
      </a>

</div>

Nun fängt mein Problem an:

Da es sich hierbei ja um richtigen HTML-Code handelt, der auch ausführbar sein und auch, entgegen
reiner Textausgaben, eine Funktion haben soll, nämlich durch Anklicken eine bestimmte Aktion
auszuführen, muß ich die einzelnen div-Bereiche über das DOM befüllen lassen.

Mein derzeitiger Ansatz sieht folgendermassen aus:

var Ebene   = window.document.getElementById ("Ebene_Anfangsbuchstabe");

for (var i = 0; i < Film.length; ++i)
   {
      Anfangsbuchstabe = Film[i]["Titel"].substring (0,1);

if (!Liste_Anfangsbuchstaben.Im_Array_enthalten (Anfangsbuchstabe))
      {
         Liste_Anfangsbuchstaben.push (Anfangsbuchstabe);

var Verweis = window.document.createElement ("a");
         Verweis.setAttribute ("href", "javascript:void(0);");
         Verweis.setAttribute ("onClick", "document.Filterparameter.Anfangsbuchstabe.value=Anfangsbuchstabe");
         Ebene.appendChild    (Verweis);
      }

.....
   }

Aber - leider bzw. wie schon befürchtet - wird der Code nicht erzeugt, auf der anderen Seite erhalte ich
über die Mozilla Fehler-Konsole auch keine Fehlermeldung.

Hier meine Fragen:

1. Habe ich mit meinem Ansatz denn überhaupt die richtige Richtung eingeschlagen?
      Warum wird mir der Code nicht entsprechend erzeugt?

2. Wie über DOM einen Variablenwert übergeben?
      Dies hinsichtlich der Übergabe der Variablen "Anfangsbuchstabe".

3. Wie Anweisung "onClick="this.bur();" ergänzen?

Könnte Ihr mir hier weiterhelfen?

Ich bitte Euch, mir möglichst ausführlich zu antworten, da ich bislang mit DOM noch überhaupt nichts zu tun hatte.

Vielen, vielen lieben Dank im Voraus.

Gruß
Enrico