javascript - 子を含む JQuery アコーディオン メニューとアクティブなページの表示

Question

jQueryでアクティブページを記憶するアコーディオンメニューを作りたいです。今、私は次のメニューを持っています：

 <nav id="secondary">
    <ul id="nav">
        <li class="tournament">
            <a onclick="function">Belgie</a>
            <ul class="sub" style="display: none;">
            <li>
                <li class="first"><a href="tournament1">tournament1</a></li>
                <li class="last"><a href="test">test</a></li>
            </li>
            </ul>
        </li>
        <li class="tournament">
            <a onclick="function">Nederland</a>
            <ul class="sub" style="display: none;">
            <li>
            <li class="first"><a href="Nedtournament1">Nedtournament1</a></li>
            <li class="has_children current">
            <a href="Nedtournament2">Nedtournament2</a>
                <ul class="dropdown">
                <li class="first"><a href="subtournament2-1">subtournament2-1</a></li>
                <li class="last current"><a href="subtournament2-2">subtournament2-2</a></li>
                </ul>
            </li>
            <li><a href="Nedtournament3">Nedtournament3</a></li>
            <li class="last"><a href="Nedtournament3">Nedtournament3</a></li>
        </li>
    </ul>
</nav>

次のjQueryを使用して、Cookieを設定して、現在のページと展開する必要があるメニューを決定します。これは機能しますが、子ページでは機能しません。

// creatie cookie
$('#nav > li > a').click(function(){
  var navIndex = $('#nav > li > a').index(this);
  $.cookie("nav-item", navIndex);
  $('#nav li ul').slideUp();
   if ($(this).next().is(":hidden")){
       $(this).next().slideUp();
   } else {
   $(this).next().slideToggle();
   }
   $('#nav li a').removeClass('active');
   $(this).addClass('active');       
  });

// use cookie value  
var checkCookie = $.cookie("nav-item");
  if (checkCookie != "") {
$('#nav > li > a:eq('+checkCookie+')').next().show();
} 

//  complete jquery
$(document).ready(function () {
var checkCookie = $.cookie("nav-item");
if (checkCookie != "") {
$('#nav > li > a:eq('+checkCookie+')').next().show();
}
$('#nav > li > a').click(function(){
  var navIndex = $('#nav > li > a').index(this);
  $.cookie("nav-item", navIndex);
  $('#nav li ul').slideUp();
   if ($(this).next().is(":visible")){
       $(this).next().slideUp();
   } else {
   $(this).next().slideToggle();
   }
   $('#nav li a').removeClass('active');
   $(this).addClass('active');
 });
});

クリックすると展開するcildページを追加する方法を知っている人はいますか? そして、ページをリロードすると、それらは展開されたままになります。