Javascript 如何将生成的HTML（使用JS）与另一个JS脚本一起使用？

我对JS非常陌生，我正在做一个练习，创建一个动态菜单，非常简单，实际上就是这个菜单：

问题是，如果我使用这个精确的代码，一切都正常，但是如果我取出

部分并用生成它的JS替换它（将来生成动态菜单），它会停止工作，所有东西都会显示（甚至子菜单），但无法将它们滑回。我以前从未做过这样的事，你有什么建议吗

（请不要使用“accordiAn”…它只是uff nghhh:）
因此，演示中的accordiOn使用ID

accordiOn

，如中所示

<div id="accordion">

---

上述代码也适用于动态生成的手风琴，因为我们使用了

.on（）

方法，该方法将把单击事件委托给现有的元素，也委托给将来的元素

你能确定你的密码吗？在不知道自己在做什么的情况下，很难判断出你做错了什么。您好，谢谢您的回答，但是我在代码上尝试了这个方法，但没有成功，idk如果这是我生成de HTML的方式，我一直在看它，似乎工作得很好。它会按所支持的方式生成元素列表，但它会一直显示所有元素，而不是等待单击以显示或隐藏它们them@RodolfoJos你看到我的jsBin例子了吗？您是否已将CSS中的所有

#accordian

重命名为

.accordion

（CLASS！！）了？您是否已修复打字错误

手风琴>手风琴

？因此，正如您所看到的，代码工作得非常好。

<div class="accordion"><!-- menu here bla bla --></div>

/*jQuery time*/
$(document).ready(function(){

    // $(".accordion h3").click(function(){ NO! use dynamic click delegation
    $(document).on("click", ".accordion h3", function(){
        //slide up all the link lists
        // $("#accordian ul ul").slideUp(); Wrong. Reference to this!
        $(this).closest(".accordion").find("ul ul").slideUp();
        //slide down the link list below the h3 clicked - only if its closed
        if(!$(this).next().is(":visible")) {
            $(this).next().slideDown();
        }
    });

});