title: Download image with JavaScript
body: <p>Right now I have a <code>canvas</code> and I want to save it as PNG. I can do it with all those fancy complicated file system API, but I don't really like them.</p>
  
  <p>I know if there is a link with <code>download</code> attribute on it:</p>
  
  <pre><code>&lt;a href="img.png" download="output.png"&gt;Download&lt;/a&gt;
  </code></pre>
  
  <p>it will download the file if the user clicks on it. Therefore I came up with this:</p>
  
  <pre><code>$("&lt;a&gt;")
      .attr("href", "img.png")
      .attr("download", "output.png")
      .appendTo("body")
      .click()
      .remove();
  </code></pre>
  
  <p>Demo: <a href="http://jsfiddle.net/DerekL/Wx7wn/">http://jsfiddle.net/DerekL/Wx7wn/</a></p>
  
  <p>However, it doesn't seem to work. Does it have to be trigger by an user action? Or else why didn't it work?</p>