truy cập yếu tố jquery sau khi chức năng append

Question

tôi sử dụng thêm chức năng để làm thêm một số div vào yếu tố khác

('#test-append').append("<div class='new_div'><b>some text</b></div>") 

tất cả mọi thứ đang diễn ra tốt đẹp và tôi có thể thấy div thêm, `nhưng tôi cũng cần sau đó truy cập chọn div để làm điều gì đó với điều này div ví dụ để giấu nó vì vậy tôi sử dụng folowing

$('.new_div').click(function(){ 
      do somthing here 
     }); 

nhưng nó không được làm việc ngay cả khi tôi chỉ sử dụng cảnh báo đơn giản ('hi') gọi. Nó có vẻ như jquery không nhận ra lớp append (Tôi cũng đã thử nó với Id và tôi nhận được kết quả tương tự)

tôi sẽ đánh giá cao một số giúp đỡ về vấn đề này

Cảm ơn

Answer 1

trước jquery 1.7 bạn cần sử dụng live() hoặc delegate() để ràng buộc sự kiện với các phần tử bỏ qua việc chúng tồn tại tại thời điểm ràng buộc hay không.

từ jquery 1.7, bạn có thể sử dụng

$('root-element').on('click', 'selector', function() { do it }) 

trên được chỉnh sửa theo Jaspers bình luận

Answer 2

tôi có lẽ sẽ tuyên bố div đầu tiên sau đó sử dụng nối thêm vào.

var newDiv=$("<div class='new_div'><b>some text</b></div>"); 

newDiv.appendto('#test-append'); 

newDiv.click(function(){ do somthing here }); 

Answer 3

Bạn có thể thêm phần tử, sau đó chọn nó vì nó sẽ trở thành một phần tử con của sự lựa chọn ban đầu:

$('#test-append').append("<div class='new_div'><b>some text</b></div>").children('.new_div').click(...); 

Hoặc bạn có thể sử dụng .appendTo() mà gắn thêm các yếu tố (s) mà còn giữ họ đã chọn:

$("<div class='new_div'><b>some text</b></div>").appendTo('#test-append').click(...); 

Hoặc như những người khác đã tuyên bố bạn có thể lưu tham chiếu đến phần tử trong biến và sau đó sử dụng biến đó sau đó để thao tác ent:

var $element = $("<div class='new_div'><b>some text</b></div>").appendTo('#test-append'); 
$element.click(...);//but you could have just chained the call like the previous example 

Answer 4

phương pháp Có lẽ đây không được khuyến khích ... nhưng nó hoạt động (jQuery 2.1.3)

$('.current_element').append("<div class='future_element'><b>some text</b></div>").find('.future_element').click(function(){ 
    console.log('you can see me if you click appended element'); 
}); 

và phiên bản khi chúng tôi thêm phần tử vào số nhấp chuột

$('.current_element').click(function(){ 
    $('body').append("<div class='future_element'>anything</div>"); 
    $('.future_element').click(function(){ 
     $(this).text('do something with appended element'); //for example 
    }); 
});