Question

I have one menu, In that menu when we click on it’s main div so it’s color change and when we again click so still it remain same color.

Now What I need that, In this toggle menu when we click on this so it’s color change but when we again click so it will look like other parents div.

here is my fiddle. Please check it.

and this is my script.

$(document).ready(function() {

$(".widget2").hide();
$(".inner").hide();

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;
}

$(".box2").hover(

function() {
    $(this).addClass("hover");
}, function() {
    $(this).removeClass("hover");
});

var widget2 = $(".widget2");
var box2 = $(".box2");
if (getCookie('box2id') || getCookie('box1text')) {
    var text = getCookie('box1text');
    var id = getCookie('box2id');
    $('#' + id).addClass("active");
    $('#' + id).next().slideDown(600, function() {
        $('.box:contains(' + text + ')').next('.inner').slideDown(500);
    });
} else {
    $(".widget2").hide();
    $(".inner").hide();
}

box2.click(

function() {
    $(this).next(widget2).slideToggle(200);
    $(".widget2").not($(this).next(widget2)).stop(true, false).slideUp();       //Hide others divs   
    var box2ID = $(this).attr('id');
    $(".box2").removeClass("active");
    $(this).removeClass("hover").addClass("active");
    setCookie('box2id', box2ID);
});

$(".box").click(function() {
    $(this).next(".inner").slideToggle(200);
    var box1TX = $(this).text();
    setCookie('box1text', box1TX);
});

});​

Answer 1

This problem is solved.

This example is working fine here. Please check my link.