title: Why is my `then` event firing before my `when` event is finished?
body: <p>I have a list of previewed posts on my page. When they're clicked on, they should load the full text of the post, load the comments, and slide down to reveal both.</p>
  
  <p>I have one function, partialSlide, that simulates slideDown, but starting at a specified height - it's adapted from <a href="https://stackoverflow.com/a/9036261/709443">this answer</a>. The other two functions, loadFullPost and loadComments are mine.</p>
  
  <p>All the events are firing, but partialSlide is firing before loadComments is finished, so it's not taking them into account when calculating the height, and hence they're being cut off.</p>
  
  <p>Why is that happening when I have them set up in a when > then format?</p>
  
  <pre><code>$.when(loadComments(divID,postID)).done(partialSlide(divID));
  </code></pre>
  
  <p>Am I misunderstanding how promises work in jQuery? Elsewhere in my code they've worked as expected (the <code>then</code> only runs once the <code>when</code> is done).</p>
  
  <p>Full functions below:</p>
  
  <pre><code>function loadFullPost(permalink,divID,postID) {
      $.when($.when($.ajax({url: permalink+"?ajax=true", success:                 
         function(result){$("#"+divID+"").html(result);}})).then
             (function( data, textStatus, jqXHR ) {
              $.when(loadComments(divID,postID)).done(partialSlide(divID));
      }));    
  }
  
  function loadComments(divID,postID) {
      $.ajax({url: "ajax-comments/?post_id=" + postID, success:      
      function(result){
          $("#" + divID + " .comment.list").html(result);
      }});
  }   
  
  function partialSlide(divID) {
      var contentHeight = $("#"+divID+"").addClass('full').height();
          $("#"+divID+"").removeClass('full').animate({ 
              height: (contentHeight == $("#"+divID+"").height() ? 100 : contentHeight)
          }, 500);    
  }
  </code></pre>