jQuery onlick事件在AjAX成功调用中不起作用

我正在开发一个简单的博客帖子，用户可以在这里发表评论和喜欢。我在动态内容方面遇到了一些问题。当用户对帖子发表评论时，我会动态添加内容

 <script>
    $(document).ready(function () {
      
        $('#post-comment-{{my_post['_id'] | string}}').on('click', function () {
            var post_id = $(this).attr('post_id');
            var comment_content = $('#comment-textarea-' + post_id).val();
            req = $.ajax({
                url: '/post_comments',
                type: 'POST',
                data: { post_id: post_id, comment_content: comment_content }
            });
            req.done(function (response) {
                var content = '<div class="mb-3">' +
                    '<div class="row align-items-top">' +
                    '<div class="col-auto ml-5"><img src="' + response.profile_pic + '" class="rounded-circle" /></div>' +
                    '<div class="col ml-n2">' +
                    '<a href = "/user_profile/' + response.user_id + '"><h1>' + response.first_name + ' ' + response.last_name + '</h1></a>' +
                    '<p class="small text-muted"><span class="far fa-clock mr-1"></span>' + str + '</p>' +
                    '<p>' + response.comment_content + '</p>' +
                    '</div>' +
                    '<div class="col-auto">' +
                    '<div class="dropdown">' +
                    **'<a href="#!" id="delete-comment-'+response.post_id+'-'+response.comment_id+'" role="button">' +
                    '<i class="fa fa-times" aria-hidden="true"></i>' +
                    '</a>' +**
                    '</div>' +
                    '</div>' +
                    '</div>' +
                    '</div>'
                $('#view-post-comments-{{my_post['_id'] | string}}').append(linkify(nl2br(content)));
                $('#comments-{{my_post['_id'] | string}}').html('<i class="far fa-comments mr-1 "></i>' +
                    'Comments (' + response.comment_count + ')');
            });
        });
    });
</script>

$（文档）.ready（函数（）{
$（'#post comment-{my_post[''u id']| string}}'）。on（'click'，function（）{
var post_id=$（this.attr（'post_id'）；
var comment_content=$（'#comment textarea-'+post_id）.val（）；
req=$.ajax({
url:“/post_comments”，
键入：“POST”，
数据：{post_id:post_id，comment_content:comment_content}
});
请求完成（功能（响应）{
变量内容=“”+
'' +
'' +
'' +
'' +
“
”+str+”
'+
“”+response.comment\u content+”
”+
'' +
'' +
'' +
**'' +**
'' +
'' +
'' +
''
$（'#查看帖子评论-{my_post[''u id']| string}}'）。追加（linkify（nl2br（content））；
$（'#comments-{{my_post[''u id']| string}}'）.html（''+
'评论（'+response.comment_count+'）；
});
});
});

以下是我的删除ajax代码：

<script type="text/javascript">
    $(document).ready(function () {
        $(document).on('click','#delete-comment-{{my_post['_id'] | string}}-{{post_comments._id | string}}', function () {
            $('#delete-comment-modal-{{my_post['_id'] | string}}-{{post_comments._id | string}}').modal('show');
        });
        $('#confirm-comment-delete-button-{{my_post['_id'] | string}}-{{post_comments._id | string}}').on('click', function () {
            var post_id = $(this).attr('post_id');
            var comment_id = $(this).attr('comment_id');
            req = $.ajax({
                url: '/delete_comments',
                type: 'POST',
                data: { post_id: post_id, comment_id: comment_id }
            });
            req.done(function (response) {
                $('#delete-comment-modal-{{my_post['_id'] | string}}-{{post_comments._id | string}}').modal('hide');
                $('#comments-{{my_post['_id'] | string}}').html('<i class="far fa-comments mr-1 "></i>' +
                    'Comments (' + response.comment_count + ')');
                $('#show-each-comment-{{my_post['_id'] | string}}-{{post_comments._id | string}}').remove();
            });
        });
    });
</script>

$（文档）.ready（函数（）{
$（document）.on（'click'，'删除注释-{my_post[''u id']| string}}-{{post_注释._id | string}}'，函数（）{
$（“#删除注释模式-{my_post[''u id']|string}}-{{post_comments._id | string}}'）。模式（'show'）；
});
$（“#确认注释删除按钮-{my_post[''u id']|string}}-{{post_comments._id | string}}'）。on（'click'，函数（）{
var post_id=$（this.attr（'post_id'）；
var comment_id=$（this.attr（'comment_id'）；
req=$.ajax({
url:“/delete_comments”，
键入：“POST”，
数据：{post_id:post_id，comment_id:comment_id}
});
请求完成（功能（响应）{
$（“#删除注释模式-{my_post[''u id']|string}}-{{post_comments._id | string}}'）。模式（'hide'）；
$（'#comments-{{my_post[''u id']| string}}'）.html（''+
'评论（'+response.comment_count+'）；
$（“#显示每个注释-{my_post[''u id']|string}}-{{post_comments._id | string}}”）。删除（）；
});
});
});

现在，如果代码是DOM和静态的，它就可以正常工作了。

---

对于我在第一个ajax成功调用中生成的动态内容，它不起作用。我需要刷新页面才能删除它。任何帮助都会得到感谢。

我在ajax中创建了dunamic模式和链接，并调用了itsemf，它成功了