jQuery addClass example

Change class name on click in jQuery

by fest1val

HTML

<nav class="main_nav">
  <ul class="d-flex flex-row align-items-center justify-content-start">
    <li><a href="#about">О клубе</a></li>
    <li><a href="#clubcard">Клубные карты</a></li>
    <li><a href="#advantages">Преимущества</a></li>
    <li><a href="#gallery">Галерея</a></li>
    <li><a href="services.html">Фитнес программы</a></li>
    <li><a href="team.html">Команда</a></li>
    <li><a href="#contacts">Контакты</a></li>
  </ul>
</nav>

CSS

body {
  background: #20262E;
  padding: 20px;
  font-family: Helvetica;
}

.main_nav a {
  color: #fff;
}

.main_nav a.active {
  color: red;
}

JavaScript

$(function () {
	//var hash = location.hash;
  var hash = "#about";
	$('.main_nav').find('a[href="'+hash+'"]').addClass('active');
});