jQuery /在另一个元素中附加一个div元素，并对其进行目标/控制

Question

对于网站的移动版本我正在使用jQuery在另一个div（复选框元素）中创建div元素（关闭按钮）：

  var $newDiv = $("<div/>") 
                .addClass("closebtn")  
                .html("Close [X]");
  $(".checkbox_elements").prepend($newDiv); 

这很好但是当我在div里面添加一个click函数（关闭按钮）时，我无法“隐藏”父div（复选框元素）：

  $(".closebtn").click(function(){
    $(".checkbox_elements").css("display", "none");
   //or
    $(this).prev(".checkbox_elements").css("display", "none");       
  });

当我将关闭按钮附加到复选框元素div之外的任何其他元素时，它可以正常工作。 如何让click函数在checkbox元素div容器中工作？

感谢您的支持！

Answer 1

由于动态添加按钮（closebtn），您需要尝试event delegation

$('.checkbox_elements').on('click', ".closebtn", function () {
    $(".checkbox_elements").css("display", "none");
    //or
    $(this).parent(".checkbox_elements").css("display", "none");
});