Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

169
Views
Highlight of the current menu item and marking when the submenu item is active

I want the current page of the navigation including the start page to get the css class "active". In addition, if a submenu item is selected, the parent menu should also get this class.

$(document).ready(function(){
    $("a[href*='" + location.pathname + "']").addClass("active");
});
.active {
        background-color: #009EE3;
    color:#fff;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
    <nav>
        <ul>
            <li class="first-menu"><a href="http://test.local/">Home</a></li>
            <li class="first-menu"><a href="">Menu1</a>
            <ul>
            <li class="sub-menu"><a href="/m1a/">Menu1Sub1</a></li>
                <li class="sub-menu"><a href="/m1b/">Menu1Sub2</a></li>
                <li class="sub-menu"><a href="/m1c/">Menu1Sub3</a></li>
                <li class="sub-menu"><a href="/m1d/">Menu1Sub4k</a></li>
            </ul>        
            </li>
<li class="first-menu"><a href="/downloads/">Menu2</a></li>

    </nav>
    </div>

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!