Как добавить/скрыть классы при нажатии?

Question

[Rebldomakr]

Изначально #home1 имеет класс .active-content
Мне надо чтобы при нажатии на ссылку home2, класс с #home1 удалился и присвоился к #home2

<ul class="navigation">
  <li><a href="#home1">home1</a></li>
  <li><a href="#home2">home2</a></li>
  <li><a href="#home3">home3</a></li>
</ul>


<div id="content">
  <section id="home1" class="active-content">
    Lorem ipsum dolor1
  </section>
  <section id="home2">
    Lorem ipsum dolor2
  </section>
  <section id="home3">
    Lorem ipsum dolor3
  </section>
</div>






<style>


#home1, #home2, #home3{
  display: none;
}

.active-content{
  display: block !important;
}




</style>

Answer 1

[gh0sty]

Js. Я использую JQuery. Тут 2 варианта - первый статический, второй динамический. На какой сам... Крч вот второй (на глаз):

$('.navigation li a').on('click', function(e) {
    //e.preventDefault(); - раскомментировать, если не хочешь менять хеш
    $('#content section').removeClass('active-content'); // чистим все секции от класса active-content
    $('#content section ' + e.href).addClass('active-content'); // если не выкатит, попробуй $(e).attr('href') и чекни значения, есть ли там #
});