從DOM中刪除已添加Javascript和jQuery的項目？

Question

我正在開發一個JavaScript/jQuery項目，當點擊一個按鈕時，將一組div和輸入字段添加到一個頁面中，當點擊該按鈕時，會有另一個按鈕將這些項目從頁面中移除。

我的問題是，它不會刪除頁面加載後已添加到頁面中的項目。所以，用Javascript添加到頁面的任何內容都不會被刪除。

下面是我使用jQuery的.on事件中的代碼，但它不會做什麼我解釋。

如何使下面的代碼適用於Dom加載後添加到頁面的項目？的.on()

// Remove "Deleted" Rows from View and mark as a Deleted item 
$(".delete").on('click',function() { 
    $(this).parents(".dnsRecord").addClass("deleted").find("input.delete").val("true"); 
    $(this).parents(".dnsRecord").find("span.undo").fadeIn('slow'); 
    PanelDNS.unsavedChanges = true; 
}); 

Answer 1

使用委派事件模型，由.delete選擇作爲傳遞第二個參數

$(document).on('click', '.delete', function() { 
    $(this).parents(".dnsRecord").addClass("deleted").find("input.delete").val("true"); 
    $(this).parents(".dnsRecord").find("span.undo").fadeIn('slow'); 
    PanelDNS.unsavedChanges = true; 
});