I am currently integrating the website's navbar using PHP, which is why I am unable to use class="active" to highlight the active tab on my navigation bar individually. To solve this issue, I attempted to add the active class to the corresponding tab using a small jQuery code snippet. However, despite my efforts, it does not seem to be working and I have been unsuccessful in finding a solution.
Here is the jQuery code I used:
<script>
$(document).ready(function(){
$("#nav_about").addClass("active");
});
</script>
Below is the HTML code for my navbar:
<nav class="navbar navbar-default navbar-sticky">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand hidden-sm" href="#myPage">Logo</a>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-center">
<li cl ass="active"><a href="index.php">Home</a></li>
<li id="nav_about"><a href="about.php">About</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> TEAM <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="teachers_panel.php">Teachers</a></li>
<li><a href="students_panel.php">Students </a></li>
</ul></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> Events <b class="caret"></b></a>
<ul class="dropdown-menu">
<li class="dropdown-header">Upcoming Events</li>
<li><a href="sidebar-right.php">1st ACC IT Carnival 2016</a></li>
<li class="dropdown-header">Past Events</li>
<li><a href="cgc.php">Inter House Cyber Gaming Competition 2015</a></li>
/* additional event links */
</ul></li>
<li><a href="u_cons.php">Gallery</a></li>
<li><a href="u_cons.php">Get Involved</a></li>
<li><a href="contact.php">Contact</a></li>
</li>
</ul>
</div>
</div>
</nav>
Edit:
I have corrected the errors in my code, including missing parentheses after $(document).ready(.. and adding a dollar sign before (document).