title: jQuery toggleClass with conditionals/default states
body: <p>Scenario: I have two buttons. In between the two buttons is a chevron image with three states defined with css. Each state has a class neutral, sell-it, buy-it. Depending on the page, the chevron could be in any one of the three states. On mouseover of either of the two buttons I'm trying to toggle the respective class. Example: If default state is class "buy-it" mousing over the buy it button will do nothing mousing over the sell it button will toggle the class "sell-it" but return to the default "buy-it" buy it on mouseout. If the chevron is in the neutral state mousing over either button would toggle buy-it/sell-it but return to neutral.</p>
  
  <p>It's so close but not quite doing what I want. </p>
  
  <pre><code>    (function(){
  
    var buttonChevrons = (function(){
  
      var initialize = function(){
        _setDefault();
        _setListeners();
      }
  
      //set default state
      var _setDefault = function(){
        //$(".chevron").addClass("neutral");
      }
      //set event listeners
      var _setListeners = function(){
        //Buy button
        $("#btnbuy").hover(function(){
          //default neutral state
          if( $(".chevron").hasClass("neutral")) {
            $(".chevron").toggleClass("buy-it");
          }
          //if buy it
          else if( $(".chevron").hasClass("buy-it")) {
            $(".chevron").toggleClass("");
          }
          //if sell it
          else if( $(".chevron").hasClass("sell-it")) {
            $(".chevron").toggleClass("buy-it");
          }
        })
        //Sell button
        $("#btnsell").hover(function(){
          //default neutral state
          if( $(".chevron").hasClass("neutral")) {
            $(".chevron").toggleClass("sell-it");
          }
          //if sell it
          else if( $(".chevron").hasClass("sell-it")) {
            $(".chevron").toggleClass("");
          }
          //if buy it
          else { $(".chevron").hasClass("buy-it") 
            $(".chevron").toggleClass("sell-it");
          }
        })
  
      }
  
      //call initialize
      return {init: initialize}
    }());
  
      //call buttonChevrons
    this.buttonChevrons = buttonChevrons;
  }).call(this);
  
  $(document).ready(function(){
  
    buttonChevrons.init()
  
  });
  </code></pre>