Jquery с HTML и CSS

Question

<nav id="site-navigation" class="main-navigation" role="navigation"> 
     <div class="container"> 
      <a href="#" class="navigation-bar-toggle"> 
       <i class="ion-navicon-round"></i>Menu </a> 

      <div class="navigation-bar-wrapper"> 

когда тег щелкнул должен быть добавлен в тег и следующий DIV теги навигационный бар обертка экстра класса активного

Answer 1

Использование:

$('.navigation-bar-toggle').click(function(){ 
    $('.navigation-bar-toggle, .navigation-bar-wrapper').removeClass('active'); 
    $(this).add($(this).next('.navigation-bar-wrapper')).addClass('active'); 
}); 

См addClass, removeClass, next и add методов.

Answer 2

Вы можете использовать обработчик щелчка, как

//dom ready handler 
jQuery(function ($) { 
    //click handler for the `a` elements 
    var $navas = $('#site-navigation .navigation-bar-toggle').click(function() { 
     //remove active class from previously selected item 
     $navas.filter('.active').not(this).next().addBack().removeClass('active'); 

     $(this).next('.navigation-bar-wrapper').addBack().toggleClass('active'); 
    }) 
}) 

Answer 3

Попробуйте это: Зарегистрировать обработчик щелчка для <a> тега и добавьте active класс, используя addClass(). Также удалите ранее добавленный класс active, если он вам нужен.

$(function(){ 
    $('.navigation-bar-toggle').click(function(e){ 
     e.preventDefault(); 
     //to remove prevously added active class use below line 
     $('.active').removeClass('active'); 

     $(this).addClass('active'); 
     $(this).next('div.navigation-bar-wrapper').addClass('active'); 
    }); 
});