title: How to make sure code in a .click() event has finished before it runs again
body: <p>I have a .click() that runs various functions with animations. These animations depend on the current position of the elements and so if the button is clicked a second time before the previous animation runs, it will be slightly off. </p>
  
  <p>Let's say my code is written like:</p>
  
  <pre><code>$('.button').click(function() {
  
      if (condition A)
         ExecuteAnimation1;
      else if (condition B)
         ExecuteAnimation2;
  
  });
  </code></pre>
  
  <p>How can I ensure the animation function has completed before calling them? Would I use the .queue() method?</p>
  
  <p>Thanks.</p>