jquery选择动态加载的div

Question

我有以下jQuery将一些html加载到一个div中，当它悬停在上面时：

$("div").hover(
    function () {
        $(this).load('htmlsnippets/divHoverButtons.txt');
    }, 
    function(){
        $("#divHoverButtons").css("visibility", "hidden");
    });

$("#setWidth").click(
    function(){
        $(this).css("visibility", "hidden");
    });

divHoverButtons.txt包含：

<div id="divHoverButtons">
    <div id='setWidth'>Set Width</div>
</div>

因此，当任何div悬停时，它变为：

<div>
    <div id="divHoverButtons">
        <div id='setWidth'>Set Width</div>
    </div>
</div>

问题是，当我点击div“setWidth”时，它不会隐藏它。我做错了什么？

Answer 1

你必须使用delegate()因为你的div #setWidth在加载时不在DOM中

http://api.jquery.com/delegate/

$("body").delegate("#setWidth", "click", function() {
  $(this).hide();
});