I've seen this done in a web page before but I forgot where the website is. Here's the scene.

I have a text box. Below it, is the text "Add Another..." When the user click on the text, it will create another text box below the text box.

At first, I simply do the writeln but it erases everything in the page. Then I copied and edited a similar code I found on the net. Here is the code:
Code:
if (document.layer) {
 document.layer.Sources.document.write(data);
 document.layer.Sources.document.close();
 }
else {
 if (document.all) {
  Sources.innerHTML = data;
  }
 }
}
Sources is the id of <span> and data contains something like this:
Code:
<input class=\"txtfld\" id=\"Source\" name=\"Source\" size=\"40\" type=\"text\">
Anyway, the second try, it kinda work but it will only show one text box after you click the "Add Another..." text. What I want is the more you click "Add Another...", the more text box will show up. And each textbox is an array (name="Source[1]",name="Source[2]",etc.) you can call with PHP.

Totally new to JavaScripting.