添加子李dynamicaly与jQuery

Question

到UL我想一个俗li添加到ol与jquery事件， 这是我的代码

success: function(data) { 
      if (data != ''){ 
       $ulSub = $("#firstList"); 
           $("#Pushtype_destinationList").val(crit1); 
       $.each(data.dataa, function (i,item) { 
      $str=""; 

        for(var key in item){ if(key != 'id'){$str+= item[key]} } 
        $ulSub.append('<li class="ui-widget-content " id="'+item.id +'" >' +$str+'</li>'); 

       }); 
      } 
     } 

和我的HTML代码中给出如下

<ol class="selected" id="firstList"> 
       <li class="ui-widget-content ">text 1</li> 
       <li class="ui-widget-content ">text 2</li> 

      </ol> 

和功能的jquery从第一醇添加元素里到第二醇是作为

jQuery('ol#firstList li').click(function() { 

     $(this).toggleClass('selected'); 

     $('#result').html($('#firstList .selected').clone()) 

    }); 

到现在的每一件事情工作的伟大，但是当我CLIC一个新的元素上使用此功能

(`for(var key in item){ if(key != 'id'){$str+= item[key]} } 
          $ulSub.append('<li class="ui-widget-content " id="'+item.id +'" >' +$str+'</li>'); 

         });) 

这个元素不能被添加到第二​​

动态添加

正如你在这里看到的，当元素text1和text2被添加时，当我在他们身上，但其他动态添加的元素牛逼

任何帮助，请

Answer 1

这是因为你只分配你的事件处理程序的事件处理程序分配的代码运行的时间在DOM中已经存在的项目。

尝试：

jQuery(document).on('click', 'ol#firstList li', function() { 
    $(this).toggleClass('selected'); 
    $('#result').html($('#firstList .selected').clone()) 
}); 

查找jQuery的文档以获得详细信息 '对'。

Answer 2

像

$ulSub.html(''); 

每个循环之前明确HTML PUT同胞代码

success: function(data) { 
      if (data != ''){ 
       $ulSub = $("#firstList"); 
       $("#Pushtype_destinationList").val(crit1); 
       $ulSub.html(''); 
       $.each(data.dataa, function (i,item) { 
       $str=""; 
       for(var key in item){ if(key != 'id'){$str+= item[key]} } 
        $ulSub.append('<li class="ui-widget-content " id="'+item.id +'" >' +$str+'</li>'); 

       }); 
      } 
     }