localStorage til en toggle menu

Hej Eksperter

Jeg har fået kigget på noget med localStorage da jeg gerne vil have min togglet menu til at blive når man refresher (Hvor den går på den påkaldte siden,men hvor undermenuen kommer frem også.
Har prøvet til med fra udgangs punkt https://jsfiddle.net/cqqtt9on/
Som jeg var så heldig at få lavet af jakobdo og mange tak det har fået mig frem af.
Men kan ikke få det at passe sammen med min menu, har prøvet at gøre sådan:
Js:
var toggle_over =
{
    ready:function()
    {
        $('.main-navigation li ul').click(function(){
            $(this).find('.main-navigation ul li.focus>ul,.main-navigation ul li:hover>ul,.secondary-navigation ul li.focus>ul,.secondary-navigation ul li:hover>ul').toggleClass('show');
        }
    )}
}
$(document).ready(toggle_over.ready);
$(document).ready(function () {
$(function(){
    $(".main-navigation li ul").click(function(){
      alert($(this).text());
    localStorage.knap = $(this).attr('id');
  });

  if (typeof(Storage) !== "undefined") {
        $(".main-navigation ul li.focus>ul,.main-navigation ul li:hover>ul,.secondary-navigation ul li.focus>ul,.secondary-navigation ul li:hover>ul").addClass('show').text(localStorage.knap);
    } else {
    alert("Localstorage not supported");
    }
});
});

CSS:
.main-navigation li ul.focus>ul,.main-navigation ul li:hover>ul,.secondary-navigation ul li.focus>ul,.secondary-navigation ul li:hover>ul{
  left:0;
  display: block;
  float: left;
  display: none;
}
.main-navigation ul li a:hover, .main-navigation ul li:hover > a, a.cart-contents:hover, .site-header-cart .widget_shopping_cart a:hover, .site-header-cart:hover > li > a, .site-header ul.menu li.current-menu-item > a {
    color: #838383;
    background-color: #FFF;
}
.main-navigation ul.show{
  left:0;
  display: flex;
  float: left;
}

Jeg er ikke lige den skrappeste til det, så måske er der nogle der kan se hvad jeg gør galt.

Med venlig hilsen
Morten