how we get selected div in cookie
===

I have one sliding menu in which I slide some div.

In that after page refresh or change I want that menu's state as it is so for that i used cookie.

In that cookie whatever value I get will affect whole class so my all child will appear on screen instead of that selected div.

I made one jsfiddle also for review. check [here](http://jsfiddle.net/wasimkazi/fauNg/25/) 
   
    function getCookie(c_name) {
    var i, x, y, ARRcookies = document.cookie.split(";");
    for (i = 0; i < ARRcookies.length; i++) {
        x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("="));
        y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1);
        x = x.replace(/^\s+|\s+$/g, "");
        if (x == c_name) {
            return unescape(y);
        }
       }
      }

    function setCookie(c_name, value, exdays) {
    var exdate = new Date();
    exdate.setDate(exdate.getDate() + exdays);
    var c_value = escape(value) + ((exdays === null) ? "" : "; expires=" +  exdate.toUTCString());
    document.cookie = c_name + "=" + c_value;
    }

    var widget2 = $(".widget2"),
    box2 = $(".box2");
    var inner = $(".inner"),
    box = $(".box");

    widget2.hide();
    inner.hide();


    if(getCookie('box2') == 'on'){
    widget2.show();
    //alert('hi');
    }else{
    widget2.hide();
    //alert('hiiiiii');
    } 

    if(getCookie('box') == 'on'){
    //widget2.show();
    inner.show();
    alert('hi');
    }else{
    inner.hide();
    //alert('hiiiiii');
    }

    box2.click(function() {
    $(this).next(widget2).slideToggle("fast", function() {
    var flag = ($(this).css("display") == 'none')?'off':'on';
      setCookie('box2', flag);
     });
    });

    var inner = $(".inner"),
    box = $(".box");

    box.click(function() {
    $(this).next(inner).slideToggle("fast", function() {
    var flag = ($(this).css("display") == 'none')?'off':'on';
    setCookie('box', flag);
     });
    });​ 
