javascript - 追加後のJQuery非表示

Question

ドロップダウンリストから要素を選択すると要素を追加するスクリプトを実行しています。そのビットはすべて正常に機能し、アイテムを追加します。追加されたアイテムには、クリックされたときに追加されたアイテムを非表示にするボタンが含まれています。私がうまくいかないように見えるのは、非表示機能です。要素を手動でHTMLに挿入し、非表示ボタンをクリックすると、コードは正常に機能するようですが、何らかの理由で追加すると機能しませんか？

$('#addteammember').click(function() {
 var usernamevalue = $("#teammemberselected").val();
 var teammemberfullname = $('#teammemberselected option:selected').text();
  $('#teammemberlist').append("<li><input class='removeteam' type='button' value="+usernamevalue+" /><span class='listitem'>"+teammemberfullname+"</span></li>");
});


$('.removeteam').click(function () {
  $(this).hide();
});   

Answer 1

これは、ボタンを動的に追加するが、clickハンドラーを既存の要素に対してのみバインドするために発生します。代わりに次のコードを使用できます。

$("#teammemberlist").on("click", ".removeteam", function () {
    $(this).hide();
}); 

Answer 2

機能を試してくださいlive。

$(".removeteam").live("click", function() {
$(this).hide();
});