javascript - jQuery toggle state changes upon refresh -

i looked through older questions , learnt solve issue need implement cookies , somehow remember states. being new jquery, turning out little tricky me implement this.

here javascript code:

$(document).ready(function(){  $('.trthjobstatus caption').click(function() {     $('.trthjobstatus th,.trthjobstatus td').slidetoggle('1000');  }); }); 

anyone knows how can use cookies remember state , avoid toggle state change when page refreshed?

thanks in advance!

i'm big fan of using localstorage on cookies, particularly if have application needs device agnostic. note code below not reset localstorage var when it's no longer needed.

    $(document).ready(function(){        if(localstorage['trthjobstatus']){         $('.trthjobstatus th,.trthjobstatus td').slidetoggle('1000');       }       $('.trthjobstatus caption').click(function() {         localstorage['trthjobstatus'] = true;         $('.trthjobstatus th,.trthjobstatus td').slidetoggle('1000');       });     }); 

edit: here solution worked!

 $(document).ready(function(){ if(window.localstorage.getitem('trthjobstatus') === 'true'){    $('.trthjobstatus th,.trthjobstatus td').slideup('1000'); }    $('.trthjobstatus caption').click(function(){     if(window.localstorage.getitem('trthjobstatus') === 'true'){   window.localstorage.setitem('trthjobstatus', 'false');                                                    }else{        window.localstorage.setitem('trthjobstatus', 'true');         }        console.log(window.localstorage.getitem('trthjobstatus'));     $('.trthjobstatus th,.trthjobstatus td').slidetoggle('1000'); });  });