JQuery不會動態添加html元素

Question

我試圖動態地操縱我的html頁面中的元素，但我遇到了一個問題。
我曾經能夠附加或刪除一個元素，但突然之間我不能再做了。
我必須在這裏做得不對...

<div id="multiUploaderTop"> 
    <div><input type="button" value="add more files" id="buttonAddFile1"></div> 
    <div id="multiUploaderContainer"> 
    <div><input type="file" name="attachment"/></div> 
</div> 
</div> 

以上是HTML的一部分，我想操縱。
下面是我正在運行的jquery腳本。
我在做什麼錯？

<script type="text/javascript"> 
$(document).ready(function(){ 
    alert("doc ready"); 
    initMultiUpload(); 
}); 

function initMultiUpload(){ 
    $("#buttonAddFile1").bind("click", function(){ 

     try{ 
      addNewFileRow(); 

     }catch(exception){ 
      alert(exception.message); 
     } 


    }); 
} 

function addNewFileRow(){ 
    try{ 
     alert("adding new file row"); 
     var container = $("#multiUploadContainer"); 
     var div = document.createElement("div"); 
     var fileInput = document.createElement("input"); 
     $(fileInput).attr("type", "file"); 
     $(fileInput).attr("name", "attachment"); 
     $(div).append(fileInput); 
     $(container).append(div); 
    }catch(ex){ 
     alsert(ex.message); 
    } 
} 
</script> 

Answer 1

你有一個拼寫錯誤，multiUploaderContainer和multiUploadContainer

var container = $("#multiUploaderContainer"); 

演示：Fiddle

它可以簡化多的

function addNewFileRow() { 
    var container = $("#multiUploaderContainer"); 
    var div = $('<div />'); 
    var fileInput = $('<input />', { 
     type: 'file', 
     name: 'attachment' 
    }).appendTo(div); 
    container.append(div); 
} 

演示：Fiddle