javascript - 通过ajax调用更新DOM后，单击事件上的jQuery丢失

我有一些工作，但是由于我不太习惯用JS编写代码，所以我不知道这是否是正确的方法。

我有一个简单的方法：

<div class="offers"></div>

通过调用myUrl，我可以检索准备使用的HTML（某些.offer div），然后再将append用作.offers div。
但我想在这些新添加的.offer上单击事件

$.ajax({
    'url': myUrl,
    success: function(data){
        offers.append(data);
        $('.offer').on('click', function(e) {
            e.preventDefault();
            $('.offers .offer').removeClass('selected');
            $(this).addClass('selected');
        });
    }
});

谢谢您的专业知识！

最佳答案

您可以简单地尝试：

$(document).on('click', '.offers .offer', function(e) {
    // Code here
});

理想情况下，出于性能目的，请使用DOM上最近的ID替换文档。

更新：在A. Wolff发表评论后，我删除了此处不需要的“ document.ready”。 （请阅读评论）。