Question 36357 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

how can I add javascript or Jquery to my navbar

I am trying to add js to my navbar, I want to make it like if I click another button, the class of that button become ‘active’, and the others become normal one

<ul>
<li><a class="nav-link active" href="">Home</a></li>
<li><a class="nav-link" href="">Semester</a></li>
<li><a class="nav-link" href="">Course</a></li>
<li><a class="nav-link" href="">Class</a></li>
<li><a class="nav-link" href="">Lecturer</a></li>
<li><a class="nav-link" href="">Student</a></li>
<li><a class="nav-link" href="">Student Attendance</a></li>
Tags:

2

Answers


  1. 0 
    $(document).ready(function() {
  $(".nav-link").click(function () {
        $(".nav-link").removeClass("active");
        $(this).addClass("active");
    });
});
    Login or Signup to reply.
  2. 0

    do this and move the .nav-link class to li tag

    $(document).ready(function() {
  $(".nav-link").click(function () {
        $(this).addClass("active").siblings().removeClass('active');
    });
});

    This an effective way to create visual and operational navigation bars on web pages. The code adds the active class to li that was clicked and remove from every other li within its parent ul

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search