javascript - Set a cookie when clicked on menu so next visit menu is open -

i've got page list of countries , sublist of it's cities. sake of simplicity made http://jsfiddle.net/ppexp/7/ few menus , submenus

a short preview of javascript , jquery.cookie link: https://raw.github.com/carhartl/jquery-cookie/master/jquery.cookie.js

$(document).ready(function(){ function checkcookie() {     if($.cookie('mainlevel')) {         var array = [];         array.push($.cookie('mainlevel'));         console.log(dirarray)     } }   $('.mainitem').click(function() {         var $cookie = ($(this).text());     console.log($cookie)     $cookie = $cookie.split(',');     $(this).next('ul').toggle(function() {         console.log('fired');         var cookieset = $.cookie('mainlevel', [$cookie], { expires: 30 });     }); }); 

});

the html generated , in jsfiddle, cant change html is.

what supposed happen:

1. when clicked on mainmenu item, submenu pops out , cookie set next time menu still open. checks name of mainmenu , cookie

jsfiddle doesn't seem load jquery cookie plugin, trying is, set name of main menu after click in array. when page loads, checks cookie, if there is, in array mainmenu items should expanded on load.

i've modified code. see inline comments. see entire code here , live demo.

$('.subitems').hide();  // check cookie checkcookie();  function checkcookie() {     // cookie exists     if($.cookie('mainlevel')) {         var index = $.cookie('mainlevel');         $(".mainitem:eq(" + index + ")").find("ul").show();     } }  // click on .mainitem $('.mainitem').click(function() {     // index     var cookie = $(this).index();      // hide subitems     $(".mainitem").find("ul").slideup();      // toggle ul in clicked item     $(this).find('ul').toggle(function() {         // save cookie         $.cookie('mainlevel', [cookie], { expires: 30 });     });      // toggle if change happend :: @lolotron     if (previousvalue != cookie) {                     $(".mainitem").find("ul").slideup();                 $(this).find('ul').slidedown();     } });