.on(click,function) 不适用于动态添加的内容

.on(click,function) not working for dynamically added content

我的动态 post 是由 .load() 添加的,它们输入 DOM 是这样的:

<div class="post">
    <h2>Basic Info</h2><button class="closer">X</button>
            <div class="innerPost">
               <h5>Notes:</h5>
                   <p>Lorem ipsum dolor sit amet.</p>
            </div>
 </div>

我的 jQuery 删除 post 在页面上的静态第一个 post 上工作,而不是新添加的动态页面。这是 jQuery:

     $(".closer").on('click', function() {
         $(this).parent().remove();
     });

我一直在尝试不同的选择器并查看其他人的类似问题,但似乎仍然无法正常工作。非常感谢任何帮助:)

这是因为选择器为运行时元素不在DOM中。使用 event delegation.

$(document).on('click', ".closer", function() {
    $(this).parent().remove();
});