How to toggle class without jQuery?
<p>i'm trying to toggle a class onClick without jQuery. I wrote the script but it seems to me it wrong)
I need to add <code>--active</code> modificator to <code>menu__button</code> class </p>

<pre><code>   &lt;div class="grid__menu"&gt;
       &lt;i class="material-icons md-48 menu__button"&gt;dashboard&lt;/i&gt;
   &lt;/div&gt;
</code></pre>

<p>and my JS (( </p>

<pre><code>   (function () {
   var menuTag = ".grid__menu i";   
   var activeModificator = "--active";
   var className = 'menu__button';
   var menu_button = document.querySelector(menuTag);    

menu_button.onclick =function() {     
   if (menu_button.classList.contains(className)) {       
     document.querySelector(menuTag).classList.add(className +      activeModificator);
     document.querySelector(menuTag).classList.remove(className);
      } else if (menu_button.classList.contains(className+activeModificator)) {
    document.querySelector(menuTag).classList.add(className);
    document.querySelector(menuTag).classList.remove(className+activeModificator);       
    } else {
        return       
        }
    };    
 })();
</code></pre>

<p><a href="https://jsfiddle.net/TsarS/ovzzz0vo/2/" rel="nofollow">jsFiddle</a></p>

<p>but what a right way? </p>