Javascript 如何在选择嵌套菜单时使下拉菜单展开

这是我的下拉列表 但当我点击下拉菜单中的一个嵌套菜单（例如：Books Registration）时，在该页面上，当该页面加载时，下拉菜单会折叠，如下所示，这是下拉代码

<ul class="nav nav-second-level">
<li id="BooksRegistration">
<a href="BooksRegistration.php"><i class="fa fa-edit"></i> Books Registration </a>
</li>
<li id="AuthorRegistration">
<a href="AuthorRegistration.php"><i class="glyphicon glyphicon-user"></i> Author Registration </a>
</li>
<li id="MembersRegistration">
<a href="MembersRegistration.php"><i class="glyphicon glyphicon-user"></i> Members Registration </a>
</li>

<li>
<a href="#">Second Level Link<span class="fa arrow"></span></a>
<ul class="nav nav-third-level">
<li>

所以我需要你们告诉我，当加载下拉列表中的嵌套页面时，如何使下拉列表展开。

---

我需要Javascript代码，因为如果您使用的浏览器在下拉列表中提供了激活的inspect元素功能（在chrome中，右键单击下拉列表，然后单击inspect），我无法使用jQuery然后切换您的下拉列表，同时查看正在更改哪个类的一侧的css复制这些类（将它们添加到下拉列表中的每个页面） 看我的例子

---

单击下拉列表时，样式中突出显示的类或属性会显示出来，因此，当下拉列表展开时，我复制了这些属性，并将它们添加到下拉列表中的每个页面中，您是否也可以提供css。更好的方法创建..顶部导航栏.下拉菜单{最小宽度：230px；边框半径：0 0 4px 4px；}.顶部导航栏.下拉菜单>li>a:悬停，.顶部导航栏.下拉菜单>li>a:焦点{颜色：#225081；背景：无；}.下拉任务{宽度：255px；}.下拉任务.进度{高度：8px；边距底部：8px；溢出：隐藏；背景色：#f5f5；边框半径：0px；}。下拉任务>li>a{填充：0px 15px；}。下拉任务p{字体大小：13px；行高：21px；填充顶部：4px；}。活动菜单{背景色：rgba（255，10，10，0.44）}