동적으로 생성 된 li 값 얻기

Question

생성 한 동적 LI 값을 가져오고 싶습니다.

정상적으로 얻는 방법을 설명하는 answer이 발견되었습니다.

이것은 내 코드입니다. 이것은 내 LI에있는 두 요소에 완벽하게 작동합니다.

<ul class="nav nav-pills nav-stacked" id="listPreReq" style="height: 200px; overflow: auto" role="menu"> 
    <li class="active"><a href="#">Action</a></li> 
    <li><a href="#">Another action</a></li> 
</ul> 


$("#listPreReq li").click(function() {  
alert($(this).html()); 
}); 

하지만 LI에 요소를 추가 할 수있는 옵션이 있습니다. 추가 한 모든 새 요소는 $ ("# listPreReq li"). click 이벤트를 발생시키지 않습니다. 이유를 모르겠다. 이것은 demo입니다.

$('#btPre').click(function(e) { 
    var Psize= $("#listPreReq").find("li"); 
    Psize = Psize.size()+1; 
    $("#listPreReq").append('<li><a href="#">Page '+Psize+'</a></li>'); 
}); 

Answer 1

Solution Demo

당신도 ul에 바인딩 할 수 있습니다 문서화 :

$("#listPreReq").on('click', 'li', function() {  
    alert($(this).html()); 
}); 

event delegation을 살펴보십시오.

Answer 2

사용 $(document).on('click','#btPre',function(e) {... 대신 $('#btPre').click(function(e) {...과 해고 될 것입니다! 이벤트 위임이라고합니다!

UPDATE : 너무이 부분 님의

$("#listPreReq li").click(function() {... 

변화를 대신 이벤트를 바인딩의

$(document).on('click',"#listPreReq li",function() {...