jquery: добавить имя класса к объекту

Question

У меня есть кнопка, которая запускает боковую панель. Когда активна боковая панель с холстом, кнопка меню не может быть нажата. Поэтому я пытаюсь найти классные имена «js-off-canvas-exit» и «is-visible», тогда кнопка меню должна получить имя класса «is-active», иначе это имя класса должно быть удалено из меню кнопка.

Моя попытка выглядит следующим образом:

var menuButton = document.getElementById('menuButton'); 
    menuButton.addEventListener('click', function(e) { 
    menuButton.classList.toggle('is-active'); 
    e.preventDefault(); 
    }); 


    $('.js-off-canvas-exit .is-visible').click(function() { 
    menuButton.removeClass('is-active');// add classname is-active to menuButton 
    } 


    $('.js-off-canvas-exit:not(.is-visible)').click(function() { 
    menuButton.addClass('is-active');// remove classname is-active from menuButton 
    } 

Может кто-то помочь мне получить эту работу?

Answer 1

Как menuButton является родным элементом DOM, вам необходимо создать объект jQuery. поскольку для объекта jQuery, а не элементов DOM, доступны методы removeClass() и addClass().

$(menuButton).removeClass('is-active'); 

вместо

menuButton.removeClass('is-active'); 

Вы можете использовать add() и remove() из Element.classList объекта.