javascript - 加载时隐藏 ul 元素，点击时显示

Question

我正在尝试创建某种菜单。我已成功创建“折叠”ul 元素，但无法弄清楚如何将 ul 元素设置为在加载时隐藏

         <ul>
        <li class="error">Displayed</li>
        <ul>
           <li class="error">Hidden</li>
              <ul>
                 <li class="error">
                    <a href="test.html">Hidden</a>
                 </li>
              </ul>              
        </ul>
    </ul>

jquery

$(".error").click(function () {
$(this).next("ul").toggle("slow");});

这是我的带有折叠 ul 元素的示例 http://jsbin.com/povafivu/1/edit?html,js,output

谢谢

Answer 1

为什么不使用css默认隐藏它呢？

ul > ul > li {
  display: none;
}