Wypisywanie serii znaków w innerHTML Opcje

[blackstone]

Witam, próbuje napisać skrypt który wpisany w pole tekstowe wyraz przedstawi w postaci ciągu literek - chodzi o to by każda litera znajdowała się w osobnym divie. Wszystko działa prawie dobrze ale problem polega na tym że skrypt wypisuje mi ostatnią literę wyrazu który zatwierdzam - javascript zamiast wyświetlić ciąg znaków wyświetla mi ostatni znak przerobiony przez skrypt. Wiem ze da się to zrobić za pomocą document.write() ale ta funkcja rozwala cały HTML , czy można to zrobić jakoś za pomocą innerHTML lub czegoś podobnego ? Gdy wyświetlam samą cyfrę dzieje się to samo, ale gdy zamiast innerHTML użyje document.write() to pokazuje się cały rząd cyferek prawidłowo.

[HTML] pobierz, plaintext 
var haslo=document.getElementById("tekst").value ;
var longer=haslo.length;
 
 
 
 
             for(i=-1 ; i<longer ; i++)
      {
 
var litera=haslo.charAt(i);
var box=' <div class="litera"> ' + litera  +  '</div>' ;
document.getElementById("field").innerHTML=box ;
      }
[HTML] pobierz, plaintext 

[blackstone]

Działa prawie dobrze (IMG:style_emoticons/default/smile.gif) , mam tylko jedno pytanie - jak wykreować div o odpowiedniej klasie lub id css ? Próbowałem przypisać do createElement klasę ale gdy to zrobiłem to nie działało nic (IMG:style_emoticons/default/sad.gif)

[HTML] pobierz, plaintext 
div = document.createElement( 'div class="litera" ' );
[HTML] pobierz, plaintext