Javascript 带有jQuery的动态div，单击即可显示内容

我一直在想办法解决这个问题。 不过我有点问题。 代码如下：

jQuery（文档）.ready（函数（）{
jQuery（“.content”）.hide（）；
jQuery（“.heading”）。单击（函数（）{
jQuery（this）.next（“.content”）.slideToggle（500）；
});
});
var el=document.createElement（'div'）；
el.className=“标题”；
el.innerHTML=“你想要什么都行”；
$（'.listResults'）。追加（el）；
var el2=document.createElement（'div'）；
el2.className=“内容”；
el2.innerHTML=“无论您想要显示什么”；
$（'.listResults'）.append（el2）；
jQuery（“.content”）.hide（）；

HTML有一个名为

listResults

的div类，所有内容都附加到该类中。当前javascript在加载后运行，因此我在

内容上调用
jQuery.hide
，一旦它生成

问题是，当我单击其中一个标题div时，它不会下拉内容。有什么想法吗？
您将在运行时创建div，因此请使用live binding，请在此处阅读有关live的内容

我不会使用live方法，它在1.9中被折旧和删除。最好的选择是在创建div时使用“on”方法
 试试这个

$('.listResults').on('click', '.heading',  function(){
    // whatever you want
});

var el = $('<div/>', {
    'class' : 'heading',
    'html' : 'whatever you want'
});
$('.listResults').append(el);

$（'.listResults'）。在（'单击'，'.heading'，函数（）上{
//随便你
});
变量el=$（''{
“类”：“标题”，
“html”：“你想要什么都行”
});
$（'.listResults'）。追加（el）；


或者你也可以试试这个

var el = $('<div/>', {
    'class' : 'heading',
    'html' : 'whatever you want',
    'click' : function(){
        // whatever you want, you can use $(this)
    }
});

$('.listResults').append(el);

var el=$（''）{
“类”：“标题”，
“html”：“你想要什么都行”，
“单击”：函数（）{
//无论您想要什么，都可以使用$（此）
}
});
$（'.listResults'）。追加（el）；


更新：这将为每个div创建单独的事件处理程序，并将消耗更多内存，因此不建议使用它，但如果您有几个div，则可以使用它

而
.live（）
自jQuery 1.7以来一直被弃用，如果您阅读了链接到第二个示例的文档，您就可以知道第二个示例是否有效。单击时不会取消隐藏内容。我也不知道如何用你的策略做到这一点。目前我所做的是使用content类创建另一个el。从那里我需要它被隐藏，一旦创建，然后取消隐藏时，标题是点击。这可能吗？我有点困惑，你能告诉我你希望这些div有什么样的工作流程吗？比如你点击它并显示内容的网站。取消隐藏内容div这是可能的，但您希望单击何处显示/隐藏div？如果div是隐藏的，则需要一个元素来单击并取消隐藏它。这是集装箱。里面有一个可以点击的按钮。单击标题后，它将显示所有由js/jquery生成的标题。您可以使用一个？