title: How to make a jquery click event fire only on first click
body: <p>I have two divs (.basic1 and .basic2). I want .basic1 to fadeout on click, and .basic2 to fade in which I have working wonderfully. The only problem is that once .basic2 fades in, if the user continues to click the link (.navbar1), it will fade in this div over and over. I know that I need to use the .bind() function, but I can't seem to figure out where in my code to put it. Thanks!</p>
  
  <pre><code>$(document).ready(function() {
      $('.navbar1').click(function(e){
          e.preventDefault();
  
          $('.basic2').hide().load('.basic2', function() {
              $(this).delay(600).fadeIn(1000);
              $('.basic1').fadeOut(1000);
          });
      });
  });
  </code></pre>