Hey there! I'm currently diving into the world of jQuery and encountering an issue with my menu. Whenever I click on a menu item with either the "tm-nav-vertical" or "tm-nav-horizontal" class, it removes the .active class from the initial menu item. I want to create a code that can be reused for any menu (such as .menu1, .menu2).
I tried using .siblings but couldn't get it to work.
$(function () {
$('.tm-nav-vertical ul li, .tm-nav-horizontal ul li').click(function () {
if ($(this).hasClass("tm-dropdown-button")) {
if ($(this).hasClass("active")) {
$(this).removeClass('active');
} else {
$('.tm-nav-vertical > ul li.active, .tm-nav-horizontal > ul li.active, .tm-dropdown-button').removeClass('active');
$(this).addClass('active');
}
} else {
$('.tm-nav-vertical ul li.active, .tm-nav-horizontal ul li.active').removeClass('active');
$(this).addClass('active');
}
});});