title: jQuery if hasclass then function
body: <p>This is an animation which should only fire if the div rip_tab has the class 'rip_tab_ripped', which is applied after the div is clicked on. However, the animation is firing even before the rip_tab_ripped class has been toggled. Each function works separately without the if clause. Any help would be appreciated--</p>
  
  <pre><code>var sauceSquirt = {
      init: function() {
  
          $("#rip_tab").click(function() {
              $(this).toggleClass("rip_tab_ripped");
          });
  
  
  
          function fireA() {
              $("#sauceRed").switchClass("sauce_hide", "sauceRedGo", 500)
          }
  
          function fireB() {
              $("#sauceBlue").switchClass("sauce_hide", "sauceBlueGo", 500)
          }
  
          if ($('#rip_tab').hasClass("rip_tab_ripped")) {
  
  
              $('#packet').click(function() {
  
                  var events = [fireA, fireB];
  
                  //declare counter
                  if (!this.counter) {
                      this.counter = 0;
                  }
  
                  events[this.counter]();
                  this.counter = (this.counter + 1) % 3;
              });
  
  
  
          }
  
      }
  
  }
  
  $(document).ready(function() {
      sauceSquirt.init();
  
  });​
  </code></pre>