jQuery—如何将处理程序附加到不带'；还不存在吗？

我刚刚在jQuery中遇到了一个问题。我没有找到已经发布的解决方案，如果有，我为我的错误道歉

我有一个DOM：

<div class='usersList list'>                                    
    <div id='7' class='sidebarElement'> <span>user</span></div> 
    <div id='21' class='sidebarElement'><span>user</span></div> 
    <div id='12' class='sidebarElement'><span>user</span></div> 
    <div id='15' class='sidebarElement'><span>user</span></div> 
    <div id='17' class='sidebarElement'><span>user</span></div> 
    <div id='13' class='sidebarElement'><span>user</span></div> 
    <div id='5' class='sidebarElement'> <span>user</span></div> 
    <div id='3' class='sidebarElement'> <span>user</span></div> 
    <div id='4' class='sidebarElement'> <span>user</span></div> 
    <div id='19' class='sidebarElement'><span>user</span></div> 
    <div id='2' class='sidebarElement'> <span>user</span></div> 
    <div id='6' class='sidebarElement'> <span>user</span></div> 
    <div id='18' class='sidebarElement'><span>user</span></div> 
    <div id='16' class='sidebarElement'><span>user</span></div> 
    <div id='14' class='sidebarElement'><span>user</span></div> 
</div>                                                          

这不起作用，我想是因为这些元素是通过AJAX加载的，当解析

点击
时，它们还不在这里，我不知道jQuery在内部是如何工作的。我的解决方法是在ajax的
success
分支中添加“点击”按钮，如下所示：

success: function (data) {
    $('.usersCardAjaxContainer').empty().html(data);

    $(".sidebarElement span").click(function() {
        console.log($(this).parent().attr("id"));
    })
}

这是可行的，但对我来说似乎是错的。我已经寻找了其他可以做到这一点的函数或方法，但我只找到了自jQuery1.7以来被弃用的
live
。还有什么我可以使用或必须坚持使用的解决方法吗？
您可以将单击事件附加到已存在的元素，但仅在该元素的某些子元素上触发它，如下所示：

$('.sidebarElement').on('click', 'span', function() {
    //...
});

从技术上讲，您甚至可以将事件附加到
$（'body'）
，只要第二个参数（jquery选择器）足够精确。但我不推荐这种方法，因为它肯定会对性能产生负面影响。
作为参考，请看。
use event delegation看看这里，你怎么没有在谷歌（或其他任何地方）搜索类似“动态元素上的jquery事件”？@Regent我确实搜索过，所有的解决方案都是在谷歌上搜索的，对我来说都不管用，但是嘿，与其抱怨我没有使用谷歌，你可以发布一个解决方案啊，现在我得到了它，所以我把它连接到身体上，但只在
上触发它。sidebarElement span
，对吗？所以我的on事件是
$（'body'）。on（'click'，'.sidebarElement span'，function（）{
，我明白了吗？Jup，与body一起工作。非常感谢！@Y你没有工作：决不要将
'body'
用于委托事件处理程序！使用
文档
作为后备方案（如果没有更接近变化元素的存在）。有一个与样式相关的
body
错误，这意味着事件（特别是单击）将不会始终工作。@TrueBlueAussie，哪个jQuery版本是这样的，这是一个公认的错误吗？我问这个问题是因为我最近有一个有趣的事件处理程序行为（
blur（）
被触发时，会有一个空堆栈跟踪（在对话中聚焦一个元素），带有“反向角色”，意思是：事件处理程序被附加到一个元素上，该元素随后被附加到
正文中。
。我在最近的jQuery版本实践中发现了这个问题（不知道这是否是官方问题），所以现在我总是使用
文档
而不是
正文
，
文档
还有一个额外的好处，那就是它在加载任何DOM之前就已经存在了。
$('.sidebarElement').on('click', 'span', function() {
    //...
});