title: jquery ajax with slideDown not working on first click
body: <p>I am using ajax to grab two pieces of text from a seperate script with jQuery.  I have done the check and the script correctly sends the infomation to the original php page.</p>
  
  <p>I have a div container that holds the <p> tags with the text in them.  These <code>&lt;p&gt;</code> tags have a class name of <code>summary_text</code>.</p>
  
  <pre><code>&lt;p class='fight_summary_text'&gt;a random piece of text&lt;/p&gt;
  </code></pre>
  
  <p>The first <code>&lt;p&gt;</code> tag is populated with information when the php page loads.  When a button is clicked, the jQuery is fired off and two more pieces of information should follow:</p>
  
  <pre><code>$(".summary_text:first").before(data.message_one).slideDown(750, function() {
      $(".summary_text:first").before(data.message_two).slideDown(750);
  });
  </code></pre>
  
  <p>The problem I am having is that the first piece of information is inserted correctly on the page.  It slides down and works fine, but the second piece of information does not appear.</p>
  
  <p>However, that alone is not the problem.  If I click the button a second time, both pieces of text appear correctly one after the other.  </p>
  
  <p>Does anyone know what is causing this? As I can't seem to locate the problem as it works when the button is clicked a 2nd, 3rd, 4th time etc.</p>