Как прикрутить cookies к меню на jQuery

<div id="menu_pop">
<ul id="accordion">
 <li><div>ГАЛЕРЕИ и СЛАЙДЕРЫ<br>
 <span class="button_podtext">Галереи и Слайдеры картинок с помощью jQuery</span></div>
 <ul>
 <li><a href="#">Ссылка 3</a></li>
 <li><a href="#">Ссылка 4</a></li>
 </ul>
 </li>
 <li><div>АНИМИРОВАННЫЙ ФОН ДЛЯ САЙТА<br>
 <span class="button_podtext">Анимированный фон с помощью jQuery</span></div>
 <ul>
 <li><a href="#">Ссылка 1</a></li>
 <li><a href="#">Ссылка 2</a></li>
 </ul>
 <li><div>МЕНЮ ДЛЯ САЙТА<br>
 <span class="button_podtext">Меню с помощью jQuery</span></div>
 <ul>
 <li><a href="#">Ссылка 4</a></li>
 <li><a href="#">Ссылка 1</a></li>
 </ul>
 </li>
 <li><div>РАЗНОЕ<br>
 <span class="button_podtext">Разные эффекты с помощью jQuery</span></div>
 <ul>
 <li><a href="#">Ссылка 3</a></li>
 <li><a href="#">Ссылка 4</a></li>
 </ul>
 </li>
</ul>
</div>

#menu_pop {
 padding: 20px 20px 20px 20px;
 margin: 40px 20px 0 20px;
 width: 280px;
 border-radius: 6px;
 box-shadow:  0px 1px 5px #000;
}
 
#accordion {
 list-style: none;
 padding: 0px;
 margin: 0px;
}
 
#accordion .button_podtext {
 font-size: 9px;
 color: #b1b1b1;
}
 
#accordion div {
 display: block;
 cursor: pointer;
 text-decoration: none;
 display: block;
 padding: 8px 0px 8px 11px;
 background: #000;
 color: #ffffff;
 font-size: 12px;
 font-family: verdana;
 background: url('images/bg.png') 0px 0px;
 text-shadow: 0px 1px 0px rgba( 0, 0, 0, 0.6);
 list-style: circle;
}
 
#accordion div:hover {
 background: url('images/bg.png') 0px -44px;
}
 
 
 
#accordion ul a {
 color: #FF9800;
}
 
#accordion ul {
 list-style: none;
 padding: 5px;
 font-size: 10px;
 font-family: Tahoma;
 background: #1a1a1a;
 box-shadow: inset 0px 3px 6px rgba( 0, 0, 0, 0.7);
 display: none;
}
 
#accordion ul li {
 font-weight: normal;
 cursor: auto;
 padding: 3px 7px;
}
 
#accordion a {
 text-decoration: none;
}
 
#accordion a:hover {
 text-decoration: underline;
}

<script type="text/javascript" src="vertical-sliding-menu-described/js/jquery.js"></script>
<script type="text/javascript" src="vertical-sliding-menu-described/js/jquery.cookie.js"></script>
<script type="text/javascript" src="vertical-sliding-menu-described/js/jquery-latest.js"></script>

<script type="text/javascript">
 $(document).ready(function(){
 
if($.cookie("num_open_ul")) { // если в куках есть число
 
        if($.cookie("num_open_ul")!=0) { // и это число не равно нулю - значит какой-то список открыт
           var number_eq=$.cookie("num_open_ul")-1; // уменьшаем порядковый номер на 1 так как eq   идёт с нуля
            $("#accordion ul").eq(number_eq).show(); // открываем соответствующий список
        }
        
       
    };
    
    
//Определяем по нажатию на какой элемент должны открыватся подменю
$("#accordion > li > div").click(function(){
            if(!$(this).next().is(':visible')) { // если кликнутый блок не раскрыт ( не виден список после него )
                        $('#accordion ul').slideUp(280);// сварачиваем все списки
                }
                $(this).next().slideToggle(280); // в любом случае переключаем (если открыт закрываем и наоборот) список после кликнутого блока
                        setTimeout(fncookie, 400);//задержка записи кук
 
                });
 
 
 
//запись в куки номера открытого меню 
function fncookie(){
var number_open_ul=0; // если ноль - то ни один не открыт
 
var i=0; // переменная- счётчик всех списков ul в меню 
$("#accordion ul").each(function(){
    i++;// порядковый номер просматриваемого списка увеличиваем на 1
    if($(this).is(':visible')){ // если блок виден то его порядковый номер заносим в специальную переменную
        number_open_ul=i;
    }
$.cookie("num_open_ul",number_open_ul);// записываем в куки номер открытого списка
        
});
}// end fncookie
 
 
});/*end  ready*/
</script>

<script>
//Определяем по нажатию на какой элемент должны открыватся подменю
$("#accordion > li > div").click(function(){
if(false == $(this).next().is(':visible')) {
$('#accordion ul').slideUp(280);
}
$(this).next().slideToggle(280);
});
</script>