title: Pass in an array of Deferreds to $.when()
body: <p>Here's an contrived example of what's going on: <a href="http://jsfiddle.net/adamjford/YNGcm/20/" rel="noreferrer">http://jsfiddle.net/adamjford/YNGcm/20/</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;a href="#"&gt;Click me!&lt;/a&gt;
  &lt;div&gt;&lt;/div&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>function getSomeDeferredStuff() {
      var deferreds = [];
  
      var i = 1;
      for (i = 1; i &lt;= 10; i++) {
          var count = i;
  
          deferreds.push(
          $.post('/echo/html/', {
              html: "&lt;p&gt;Task #" + count + " complete.",
              delay: count
          }).success(function(data) {
              $("div").append(data);
          }));
      }
  
      return deferreds;
  }
  
  $(function() {
      $("a").click(function() {
          var deferreds = getSomeDeferredStuff();
  
          $.when(deferreds).done(function() {
              $("div").append("&lt;p&gt;All done!&lt;/p&gt;");
          });
      });
  });
  </code></pre>
  
  <p>I want "All done!" to appear after all of the deferred tasks have completed, but <code>$.when()</code> doesn't appear to know how to handle an array of Deferred objects. "All done!" is happening first because the array is not a Deferred object, so jQuery goes ahead and assumes it's just done.</p>
  
  <p>I know one could pass the objects into the function like <code>$.when(deferred1, deferred2, ..., deferredX)</code> but it's unknown how many Deferred objects there will be at execution in the actual problem I'm trying to solve.</p>