javascript - DOM 経由でフォーム要素を追加する

Question

フォーム要素を既存のフォームに追加する場合のすべての例では、フォーム要素を添付する要素を取得する document.getElementById メソッドを使用するか、私が使用せず、Jquery を使用する必要がない Jquery メソッドです。 .

これは私が持っているフォームです

    <form name="formname" action="javascript:return false;" enctype="multipart/form-data" method="post" onSubmit="processCart(this);">
<table>
<tr>
<td>&nbsp;&nbsp;</td>
<td>Number&nbsp;&nbsp;</td>
<td>Price&nbsp;&nbsp;</td>
<td>Quantity&nbsp;&nbsp;</td>
<td>Remove</td>
</tr>
<tr>
<td>&nbsp;&nbsp;<input type="checkbox" name="items" value="Item 1"></td>
<td># 1&nbsp;&nbsp;</td>
<td>$<input type="text" name="price" size="12" value="1.00" readonly /></td>
<td><input type="text" name="quantities" value=""/></td>
<td>&nbsp;</td>

要素を追加するボタンは「アイテムの追加」と呼ばれ、クリックすると、既存のフォーム要素の後にフォーム要素を追加することになっています。

Javascript でこれを実現する方法についてのアイデアをいただければ幸いです。これまでのコードのクリップ

function insertFormElements(){

for(i in ele){
    itm = 'item_'+i;
    amt = 'amount_'+i;
    qty = 'quantity_'+i;

    // add a new Inputs
    addElement(itm,"text","");
    addElement(amt,"text","");
    addElement(qty,"text","");
    // add values       
    document.formname[ itm ].value = ele[i].items;
    document.formname[ amt ].value = (ele[i].amount * ele[i].quantity);
    document.formname[ qty ].value = ele[i].quantity;
    }
    return true;

}

関数 addElement

function addElement(){
try{
    var element = document.createElement("input");

    //Assign different attributes to the element.
    element.setAttribute("name", arguments[0]);
    element.setAttribute("type", arguments[1]);
    element.setAttribute("value", arguments[2]);
    document.formname.appendChild(element);
    }catch(e){
        alert( e );
    }

}

アラートが表示されておらず、要素が追加されたこともありません。