は、私はHTMLを持って手続き

Question

をボタンを削除してくださいボタンを押すと、<li>要素が削除されます。

削除しません。

アイデア？

Answer 1

$(".del").click(function(e) { 

これが唯一それが走っていますときに存在.del要素に特異的に結合します。 .liveを使用します。

$(".del").live('click', function(e) { 
    $(this).parent().remove(); 
}); 

これは、追加されたタイミングに関係なく、イベントを要素にバインドします。

編集：.liveは非推奨と思われます。代わりに.onを試してみてください。

$(document).on('click', '.del', function(e) { 
    $(this).parent().remove(); 
}); 

Answer 2

問題の原因は、.clickを使用してハンドラをバインドするときに要素が存在しないことです。あなたは.liveを使用することができますが、要素を制御するので、より良い解決策は、動的ハンドラをアタッチすることです：

function deleteClicked(e) { 
    $(this).parent().remove(); 
} 

$(".del").click(deleteClicked); 


$("#pusher").click(function(e) { 
    var text = "test"; 
    var lix = $("<li>").addClass('uix').text(text); 
    lix.append($('<button>').addClass('del').text('xx').click(deleteClicked)); 
    lix.appendTo($("#sortable")); 
}); 

Answer 3

jQueryを使用する必要があります。on || liveイベントバインディングは、現在および将来の現在のセレクタに一致するすべての要素のイベントハンドラをアタッチします。

のjQuery 1.7以降

$(document).on('click', '.del', function(e) { 
    $(this).parent().remove(); 
}); 

のjQuery 1.3以降

$('.del').live('click', function(e) { 
    $(this).parent().remove(); 
});