title: Using JavaScript to get JSON response and display on the webpage, testing JavaScript
body: <p>I'm trying to create a JS app with the following functionality: A button that gets a JSON document and displays that text. I'm going through an Elasticsearch tutorial, and there is indeed valid JSON at the url I provide:</p>
  
  <pre><code>{"_index":"planet","_type":"hacker","_id":"xfSJlRT7RtWwdQDPwkIMWg","_version":1,"exists":true, "_source" : {"handle":"mark","hobbies":["rollerblading","hacking","coding"]}}
  </code></pre>
  
  <p>When using the code below...I get an alert of</p>
  
  <pre><code>[object Object]
  </code></pre>
  
  <p>instead of an alert with the full JSON. I'm planning to take the steps next of actually selecting part of the JSON, but I'd like to at least see the full document first...</p>
  
  <p>Any ideas? Thank you in advance!</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;&lt;title&gt;Demo&lt;/title&gt; &lt;meta http-equiv="content-type" content="text/html; charset=utf-8" /&gt;&lt;/head&gt;
  
  &lt;body&gt;
    &lt;input id="testbutton" type="button" value="Test" /&gt;
    &lt;p id="results"&gt;results appended here: &lt;/p&gt;
  
  &lt;script type="text/javascript" src="jquery-1.10.2.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  $(document).ready(function() {
      $("#testbutton").click(function() {
          $.ajax({
              url: 'http://localhost:9200/planet/hacker/xfSJlRT7RtWwdQDPwkIMWg',
              dataType: 'json',
              success: function(data) {
                  $("#results").append('all good');
                  alert(data);
              },
               error: function() {
                  $("#results").append("error");
                  alert('error');
              }
          });
      });
  });
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>