我如何刪除 <li> 上 <ul> 我是通過jQuery添加的？

Question

我有兩個列表，其中一個是空的。 當我單擊非空列表中的項目時，我將其刪除並添加到其他列表中。 問題是我添加到列表中的項目，如果單擊它們，則無法刪除並將其移至原始列表。 我添加代碼。

這是HTML代碼

<ul class="list-unstyled" id="seleccion">

</ul>

<ul class="list-unstyled" id="categorias">
    <li>Subcategoría</li>
    <li id="494">
        <i class="glyphicon glyphicon-plus-sign"></i> 
        <a> Mujer</a>
    </li>                                   
    <li id="553">
        <i class="glyphicon glyphicon-plus-sign"></i> 
        <a>Hombre</a>
    </li>                                   
</ul>

這是jQuery代碼：

$("#categorias li a").click(function(){
    var texto = $(this).text();
    var badge = $('<li>',{class:"categorias"}).append($('<i>',{class:"glyphicon glyphicon-minus-sign"})).append($('<a>',{text:texto}));
    $('#seleccion').append(badge);
    $(this).hide();
});

$("#seleccion li").click(function(){
    var texto = $(this).text();
    var tipo = $(this).attr('class');
    var badge = $("<li>").append($('<i>',{class:"glyphicon glyphicon-plus-  sign"})).append($('<a>',{text:texto}));
    $('#'+tipo).append(badge);
    $(this).hide();
});

例如，當我單擊“ Mujer”時，該元素移動到第一個ul，但是如果單擊此元素，則可以將其刪除。

謝謝。

Answer 1

用這個：

$(document).on("click", "#seleccion li a", function(){

代替$("#seleccion li").click(function(){