Javascript 成功后，ajax调用锚标记的href属性不起作用

我有这些

    <div id="shelf">
    <div>
      <input type="text" id="new-shelf-text" onkeyup="(this.value).trim().length?$('#add-shelf-btn').removeClass('disabled'):$('#add-shelf-btn').addClass('disabled');" placeholder="Add new shelf">
    </div>
    <div>
      <div id="add-shelf-btn" class="button postfix disabled">Add</div>
    </div>

    <a class="shelfName" href="#shelF"> Shelf Lists </a>

    <div id="shelF" class="content">
      welcome in shelf listing      
    </div>   
    </div>
    <script>

    $("#add-shelf-btn").click(function() {

    $.ajax({
      type: "POST",
      url: "{% url 'shelf' groupid %}",
      datatype: "html",
      data:{
        shelf_name: $('#new-shelf-text').val(),
        csrfmiddlewaretoken: '{{ csrf_token }}'
      },
      success: function(data) {
        $("#shelf").html(data);
      }
    });

    });

    </script>

当我在成功返回ajax后单击上面提到的链接锚标记时，它不会调用id为shelF的div 有人能帮我吗？我想打电话给警察

<div id="shelF" class="content"> 

点击链接

<a class="shelfName" href="#shelF"> Shelf Lists </a>

---

请记住，它第一次工作正常，但当它从成功的ajax调用返回时，该div不会被调用

尝试将此用于触发器：

$(document).on("click", "#add-shelf-btn", function() {code...})

---

如何调用div？$shelf.htmldata；在html中，您的id是shelF，并且您正在id shelfsmall f中插入数据，而该id shelfsmall f不存在。尝试更改：$shelf.htmldata；使用此$shelF.htmldata；Phylax&Vishal，再看一遍代码，现在告诉我，我的问题是我想调用click of link，就像我第一次说的那样，作为一个简单的html，但当我单击Add时，它会调用ajax调用，当它成功返回时，我想调用click of link的div不起作用。现在我希望你明白我的问题了伙计们，请建议一个答案，我从3天起就在这里被绊倒了。布拉德利，请看我告诉phylax&Vishal的上面的评论，这样你就可以弄清楚确切的问题，再看一遍代码，帮我解决问题。我仍然很困惑，所以你的ajax调用可以工作，但div没有加载？或者div正在加载，您想在返回div后设置另一个单击处理程序以显示其他内容？是的，ajax调用可以工作，即使div也会加载新内容，但当我刷新页面时，该div中只会显示内容。因此，ajax加载内容后，此链接不起作用，意味着这个div不会被调用。但是当我刷新页面时，只有这个链接起作用。你是从一个单独的文件加载那个div吗？或者它只是隐藏在页面上？不，那个div来自同一个文件，而且它也没有隐藏在页面上