title: jQuery AddClass and RemoveClass function for multiple element throughout web page
body: <p>I submitted my code on a code review site and it highlighted that have duplicate functions within my script which can be seen below.</p>
  
  <pre><code>$(document).ready(function () {
  
      $('#search-btn').click(function () {
          $('.search-bar-wrap').toggleClass('searchActive');
          $('.more-menu').removeClass('moreMenuActive');
          $('account-menu').removeClass('acMenuActive');
      });
  
      $('.more-btn').click(function () {
          $('.more-menu').toggleClass('moreMenuActive');
          $('.account-menu').removeClass('acMenuActive');
          $('.nav-bar-wrap').removeClass('searchActive');
      });
  
      $('.ac-btn').click(function () {
          $('.account-menu').toggleClass('acMenuActive');
          $('.nav-bar-wrap').removeClass('searchActive');
          $('.more-menu').removeClass('moreMenuActive');
      });
  
      // MOBILE 
  
      $('#mobile-menu').click(function () {
          $('.mobile-menu').toggleClass('mobileMenuActive');
          $('.m-accord-dwn').removeClass('accordionActive');
      });
  
      $('.active-mobile-menu').click(function () {
          $('.mobile-menu').toggleClass('mobileMenuActive');
          $('.m-accord-dwn').removeClass('accordionActive');
      });
  
      $('.mobile-accordion').click(function () {
          $('.m-accord-dwn').toggleClass('accordionActive');
      });
  });
  </code></pre>
  
  <p>The click functions demonstrated above are adding and removing classes to show can hidden element on the web page and to also give the click but an active state etc. I am trying to follow best practices for me code. Based on my code above is there a way create a global active function? <a href="http://jsfiddle.net/newkidontheblock/yg62tdob/18/" rel="nofollow">Jsfiddle</a></p>