title: How to set active class on click?
body: <p>So i have this navigation on my header but problem is when i click on link and redirect me to that page it lose active class. Any suggestion?   </p>
  
  <pre><code>&lt;nav&gt;
    &lt;div class="menu-topmenu-container"&gt;
      &lt;ul id="menu-topmenu" class="menu"&gt;
        &lt;li id="whats-on" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-53"&gt;
           &lt;a href="#whatson" class="active"&gt;What’s On&lt;/a&gt;
        &lt;/li&gt;
        &lt;li id="menu-item-52" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-52"&gt;
           &lt;a href="visiting-us"&gt;Visiting Us&lt;/a&gt;
        &lt;/li&gt;
        &lt;li id="menu-item-46" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-33 current_page_item menu-item-46"&gt;
          &lt;a href="collections-research"&gt;Collections &amp;amp; Research&lt;/a&gt;
        &lt;/li&gt;
        &lt;li id="menu-item-50" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-50"&gt;
          &lt;a href="learning"&gt;Learning&lt;/a&gt;
        &lt;/li&gt;
        &lt;li id="menu-item-49" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-49"&gt;
            &lt;a href="get-involved"&gt;Get Involved&lt;/a&gt;
        &lt;/li&gt;
     &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>This is my script:</p>
  
  <pre><code>jQuery(function($){
      $('nav ul li a').on('click', function () {
          $(this).closest('nav ul').find('a.active').removeClass('active');
          $(this).addClass('active');        
      });
  });
  </code></pre>