title: Deferreds on jQuery.each result
body: <p>I'm learing deferreds, and can not work out how/why this works:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div&gt;
          1&lt;/div&gt;
      &lt;div&gt;
          2&lt;/div&gt;
      &lt;div&gt;
          3&lt;/div&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script&gt;
          $("div").each(function (i) {
              $(this).delay(1000 * i).fadeOut();
          }).promise().done(function () { console.log("it's done"); });
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>In prarticular: <strong>why can I call promise after each? Why it's technically possible?</strong> I've console.logged:</p>
  
  <pre><code>console.log($("div").each(function (i) {}));
  </code></pre>
  
  <p>and I do see <strong>promise</strong> method in prototype. But, my each function do not return any values, there's simply a :</p>
  
  <pre><code>$(this).delay(1000 * i).fadeOut();
  </code></pre>
  
  <p><strong>So how promise is connected to animation result? (basically each iteration's result)</strong></p>
  
  <p><strong>EDIT 1: Just to make it clear, perhaps I should have written my question like this:</strong></p>
  
  <p>How it's done that <strong>done</strong> method is called after all animations are finished == how promise is interconnected to animation that is executed inside the each callback function.</p>