title: Highlight an active menu item (anchor) on click and/or scroll
body: <p>Nothing I've found here and on the web works on the website <a href="http://lexic-on.ru/ru/" rel="nofollow noreferrer">http://lexic-on.ru/ru/</a> (Joomla based)
  I tried to use this solution <a href="https://stackoverflow.com/questions/9979827/change-active-menu-item-on-page-scroll">Change Active Menu Item on Page Scroll?</a>
  but it didn't work</p>
  
  <p>UPD:
  I put the exact JS code 
  <code>&lt;script type='text/javascript'&gt;//&lt;![CDATA[ 
  $(window).load(function(){ 
  // Cache selectors var lastId, topMenu = $("#sp-main-menu")</code> ----> my menu id<br> </p>
  
  <p>.......<br></p>
  
  <pre><code>.end().filter("[href=#"+id+"]").parent().addClass("active");
     }                  
  });
  });//]]&gt; 
  &lt;/script&gt; 
  </code></pre>
  
  <p>as well as jquery 2.3.1 link from Google in the <code>head</code></p>
  
  <p>Menu looks like this: </p>
  
  <pre><code>&lt;div id="sp-main-menu" class="visible-desktop"&gt;
                  &lt;ul class="sp-menu level-0"&gt;&lt;li class="menu-item active first"&gt;
  </code></pre>
  
  <p>....<code>&lt;a href="#services" class="menu-item" &gt;&lt;span class="menu"&gt;&lt;span class="menu-title"&gt;Услуги&lt;/span&gt;&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;</code>.....</p>
  
  <p>It works perfectly on a test page without other scripts. But nothing works on the site. I guess some other script conflicts with this one.</p>