jQuery toggle cookie not working

Question

I am trying to toggle cookie with jquery cookie plugin. This is how my code looks. the toggle works fine and the cookie is set. the cookie is being saved in browser which I can view with chrome developer tools but the toggle state is not being saved.

    if(jQuery.cookie('toggledesc') == 1){
            jQuery('.cat_table .hentry').addClass('active_plgn');
            jQuery('.cat_table .hentry .desc_trigger').removeClass("fa-plus-square-o").addClass("fa-minus-square-o");
            jQuery('.desc_inner').css({"display":"block"});

        }

    //when clicked on .expand_desc set cookie/delete cookie
    jQuery( ".expand_desc" ).toggle(function() {
        jQuery('.cat_table .hentry').addClass('active_plgn');
        jQuery('.cat_table .hentry .desc_trigger').addClass("fa-plus-square-o fa-minus-square-o");
        jQuery('.desc_inner').slideDown();
        jQuery.cookie('toggledesc', 1, { expires: 7, path: '/'});
    }, function() {
        jQuery('.cat_table .hentry').removeClass('active_plgn');
        jQuery('.cat_table .hentry .desc_trigger').removeClass("fa-plus-square-o fa-minus-square-o");
        jQuery('.desc_inner').slideUp();
        jQuery.cookie('toggledesc', null);
    });

Please let me know what am I doing wrong.

Thanks

Answer 1

According the the JQuery Cookie readme (https://github.com/carhartl/jquery-cookie) you remove cookies with the following:

$.removeCookie('the_cookie');

You must use the same path, domain and secure options, so for your code you should do the following:

jQuery.removeCookie('toggledesc', { path: '/' });

I am unable to test this at the moment but hopefully this fixes your problem.