Javascript 制表符和子制表符

我设计了一个包含ParentTabs和ChildTabs的页面，现在ParentTabs上显示的是ChildTabs，每个页面都包含其他内容。如何通过操作按钮（继续）转到下一个子选项卡以显示其他内容选项卡

<div id="content">
        <div class="tineUl">
            <ul class="mainUl">
                <li class="selected"><a><span>TabOne</span></a></li>
                <li><a><span>TabTwo</span></a></li>
                <li><a><span>ThirdTab</span></a></li>
                <li><a><span>FourthTab </span></a></li>
            </ul>
        </div>
        <div id="subContent">
            <div class="tineUl">
                <ul class="subMainUl">
                    <li class="selected"><a><span>TabOne</span></a></li>
                    <li><a><span>TabTwo</span></a></li>
                    <li><a><span>ThirdTab</span></a></li>
                    <li><a><span>FourthTab </span></a></li>
                </ul>
            </div>
            <div id="subContentChild">
                <p>
                   SubContent Menu Zone.
                </p>
         <input type="submit" class="button" value="Cancel"></input>
         <input type="submit" class="button" value="Continue"></input>
            </div>
        </div>
    </div>

选择您的选项卡。
JSFIDLE中没有js。你能填一下你到现在为止试过的吗？我没有任何.js，这就是我想要的；我正在寻找。您当前只有一个内容选项卡。直观地在选项卡之间切换非常简单，只需将选定的类分配给相应的
li
。但是，您将需要一个ajax调用来获取新的子内容并将其插入
subcentchild
div。或者，如果您预先加载所有子内容，则切换可见性，就像切换
li
标记一样。查看jQueryAPI文档，了解有关选择器的详细信息，如toggleclass（）、jQueryUI、switchClass（），甚至可以查看jQueryTabs。