title: How to use local storage for active class?
body: <p>How do I keep cookie stored of selected menu item with local storage?</p>
  
  <p><strong>Menu</strong>-</p>
  
  <pre><code>&lt;ul class="nav nav-pills"&gt;
      &lt;li class="active"&gt;&lt;a href="#" &gt;Customers&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" &gt;Statics&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" &gt;payroll&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Toggling active class-</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(function () {
          $('.nav-pills li').click(function () {
              $(this).siblings().removeClass('active');
              $(this).addClass('active');
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Using localstorage I tried- </p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(function () {
          $('.nav-pills li').click(function () {
              $(this).siblings().removeClass('active');
                  var menuactive = localStorage.setItem('mySelectValue', $(this).addClass('active');
                  $(this).addClass(localStorage.getItem('mySelectValue'));
              });
          });
  &lt;/script&gt;
  </code></pre>
  
  <p>Now this didn't help me.</p>
  
  <p>How do I store active class in local storage? I lose this active class when page is refreshed. 
  This question is asked many times but I didn't get any simple way of doing it.</p>