Javascript 使用jquery切换CSS类的更优雅的方式

我的任务是再次编写一些代码，随着我在这方面越来越安全，我也想变得更加优雅。这里我有一些代码，可以在单击时切换类，然后在单击时将其切换回

有没有一种方法可以用更少的代码来实现这一点

function openNav() {
  $opener = $('.topNavigation.closed .topNavOpener');
  $closer = $('.topNavigation.open .topNavOpener');
  $topNavigation = $('.topNavigation');

  $opener.click(function() {
    $topNavigation.removeClass('closed');
    $topNavigation.addClass('open');
    openNav();
  });

  $closer.click(function() {
    $topNavigation.addClass('closed');
    $topNavigation.removeClass('open');
    openNav();
  });
}

---

将其作为默认值关闭或打开，然后为另一个创建一个类，并切换该类

创建切换按钮：

$("#toggleButton").click(function(){
    $topNavigation.toggleClass('classNameHere');
}};

---

简化事情的一种方法是更改css，以便在默认情况下应用一个类（例如，默认值为closed），这样您只需打开和关闭开关即可。您至少应该修复代码，以便每次“单击”都不会重新绑定事件处理程序。这就是我要寻找的！谢谢

function openNav() {
  $('.topNavigation .topNavOpener').click(function() {
    $('.topNavigation').toggleClass('open');
    openNav();
  });
}