title: Get URL from Imgur API using JavaScript
body: <p>I am trying to use JavaScript to upload image to imgur by <a href="https://github.com/paulrouget/miniuploader/blob/gh-pages/index.html" rel="nofollow">this example</a>:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;&lt;meta charset="utf8"&gt;&lt;title&gt;Yo.&lt;/title&gt;
  &lt;div&gt;DROP!&lt;button onclick="document.querySelector('input').click()"&gt;Or click&lt;/button&gt;&lt;/div&gt;
  &lt;input style="visibility: collapse; width: 0px;" type="file" onchange="upload(this.files[0])"&gt;
  &lt;script&gt;
  /* Drag'n drop stuff */
  window.ondragover = function(e) {e.preventDefault()}
  window.ondrop = function(e) {e.preventDefault(); upload(e.dataTransfer.files[0]); }
  function upload(file) {
  
      /* Is the file an image? */
      if (!file || !file.type.match(/image.*/)) return;
  
      /* It is! */
      document.body.className = "uploading";
  
      /* Lets build a FormData object*/
      var fd = new FormData(); // I wrote about it: https://hacks.mozilla.org/2011/01/how-to-develop-a-html5-image-uploader/
      fd.append("image", file); // Append the file
      fd.append("key", "6528448c258cff474ca9701c5bab6927"); // Get your own key http://api.imgur.com/
      var xhr = new XMLHttpRequest(); // Create the XHR (Cross-Domain XHR FTW!!!) Thank you sooooo much imgur.com
      xhr.open("POST", "http://api.imgur.com/2/upload.json"); // Boooom!
      xhr.onload = function() {
          // Big win!
          document.querySelector("#link").href = JSON.parse(xhr.responseText).upload.links.imgur_page;
          document.body.className = "uploaded";
      }
      // Ok, I don't handle the errors. An exercice for the reader.
  
      /* And now, we send the formdata */
      xhr.send(fd);
  }
  &lt;/script&gt;
  
  &lt;!-- Bla bla bla stuff ... --&gt;
  
  &lt;style&gt;
  body {text-align: center; padding-top: 100px;}
  div { border: 10px solid black; text-align: center; line-height: 100px; width: 200px; margin: auto; font-size: 40px; display: inline-block;}
  #link, p , div {display: none}
  div {display: inline-block;}
  .uploading div {display: none}
  .uploaded div {display: none}
  .uploading p {display: inline}
  .uploaded #link {display: inline}
  em {position: absolute; bottom: 0; right: 0}
  &lt;/style&gt;
  
  &lt;p&gt;Uploading...&lt;/p&gt;
  &lt;a id="link"&gt;It's online!!!&lt;/a&gt;
  </code></pre>
  
  <p>This example put image url in a link and liked to text "It's online!!!"</p>
  
  <p>Could you help me how to get the URL of image after uploaded? I want display image URL (e,g replace "It's online!!!" with the URL) instead of put it in a link.</p>