سلام دوستان . من یک منوی bootstrap دارم . این کد رو برای active نوشتم که روی هر لینک کلیک میکنیم اننخاب شده باشه ولی جواب نمیده.

<script>
$(document).ready(function(){
$( '.navbar-nav a' ).on( 'click', function () {
$( '.navbar-nav' ).find( 'li.active' ).removeClass( 'active' );
$( this ).parent( 'li' ).addClass( 'active' );
});
});

</script>


, و کد html
کد HTML:
 <ul class="navbar-nav ml-auto">	<li class="nav-item active">		<a class="nav-link " href="home.php">صفحه اصلی</a>	</li>	<li class="nav-item">		<a class="nav-link" href="about.php">درباره ما</a>	</li>	<li class="nav-item">		<a class="nav-link" href="contact.php">تماس با ما</a>	</li>	<li class="nav-item">		<a class="nav-link" href="#">قوانین و مقررات </a>	</li></ul>
و کد css:

.navbar-nav li.active > a {
background-color: #333;
color: #fff;
}