javascript - 動的に追加されたクラスを呼び出すことはできません

Question

ajax呼び出しでデータが入力されているページで削除を実行しようとしています。私のページには、データがロードされる前にこれがあります：

<span id="ShowSelectedCategories"></span>

そして、ajax呼び出しの後、私は以下の情報を入力します：

function(data){
    $('#ShowSelectedCategories').prepend('<a href="" id="'+b.SelectedCategoriesID+'" class="DeleteCat"> x <span style="color:red">' + data +'</span> </a>&nbsp ');
}

最後に、クリックした後、クリックした要素を削除したいのですが、機能しません。

$(function(){

    $("#ShowSelectedCategories").click(function(e){
    e.target.outerHTML //this is the part i want to remove after click

e.preventDefault();
    })

試し$(".DeleteCat).click()ましたが、そのクラスの要素が動的に作成されたため、エラーが発生しました。

あなたの助けはありがたいです

Answer 1

試してみてください$(e.target).remove()、

$("#ShowSelectedCategories").click(function(e){
         $(e.target).remove();    
         e.preventDefault();
});

ID ShowSelectedCategoriesのスパン内のクラスDeleteCatの要素を削除する場合は、次のように実行できます。

$("#ShowSelectedCategories").on("click", "DeleteCat" function(e){
         $(this).remove();    
         e.preventDefault();
});

Answer 2

$('#ShowSelectedCategories').on('click', '.DeleteCat', function(e){
    $(this).remove();
    e.preventDefault();
});

http://jsfiddle.net/Dj5NQ/

Answer 3

このようなものを使用して、動的に追加されたクラスを呼び出します

$('.class').live("click", function(){

  $('#id').remove();   


});