javascript - 在侧边栏中点击除了第一行之外的父菜单，却只展起第一行子菜单，而且没有展起对应的子菜单。

Question

在侧边栏中点击除了第一位之外的父菜单，却只展起第一列子菜单，而且没有展起对应的子菜单，我写的JS是不是缺了循环语法？
请各位大神老师指点

<p class="nav-menu" id="nav_menu">
    <ul class="headlogo">
        <li class="logo-sm"><a href="#" title="返回首页"><i class="fa fa-home i-font-size"></i></a></li>
        <li class="logo" id="barsh"><a href="#" title="返回首页"><img src="img/logo.svg"/></a></li>
    </ul>
    <ul class="subnav" id="subnav-span-hide">
        <li class="submenu active">
            <a href="#" onclick="submenu()"><i class="fa fa-tachometer"><span>概况</span></i></a>
            <ul class="submenu-dorpmenu" id="submenu-dorpmenu" style="display:none">
                <li><a href="#"><i class="fa fa-tachometer"><span>首页</span></i></a></li>
                <li><a href="#"><i class="fa fa-tachometer"><span>更新</span></i></a></li>
            </ul>
        </li>
        <li class="submenu">
            <a href="#" onclick="submenu()"><i class="fa fa-pencil-square-o"><span>内容</span></i></a>
            <ul class="submenu-dorpmenu" id="submenu-dorpmenu" style="display:none">
                <li><a href="#"><i class="fa fa-tachometer"><span>系统状况</span></i></a></li>
                <li><a href="#"><i class="fa fa-tachometer"><span>系统信息</span></i></a></li>
            </ul>
        </li>
    </ul>
</p>

function submenu(){
  var dorpmenu = document.getElementById("submenu-dorpmenu");
  if(dorpmenu.style.display == "none")
  {
    dorpmenu.style.display = "";
  }else{
    dorpmenu.style.display = "none";
  }
}