title: jquery display formatted json
body: <p>Hi i have a problem becouse my json isn't display as formatted json.</p>
  
  <p>in my web page i have a <code>&lt;pre&gt;&lt;/pre&gt;</code> tag, it cointains json string:</p>
  
  <p>json example: </p>
  
  <pre><code>{"status": "OK", "output": {"pools": [{"stats": {"bytes_used": 0, "objects": 0, "kb_used": 0}, "name": "data", "id": 0}, {"stats": {"bytes_used": 0, "objects": 0, "kb_used": 0}, "name": "metadata", "id": 1}, {"stats": {"bytes_used": 0, "objects": 0, "kb_used": 0}, "name": "rbd", "id": 2}], "stats": {"total_used": 63330648, "total_space": 125604864, "total_avail": 62274216}}}
  </code></pre>
  
  <p>i use jquery script to format it:</p>
  
  <pre><code>var jsonPretty = JSON.stringify($(this).text(), null, '\t');
  $(this).text(jsonPretty);
  </code></pre>
  
  <p>but itsn not working the result is:</p>
  
  <pre><code>"{\"status\": \"OK\", \"output\": {\"pools\": [{\"stats\": {\"bytes_used\": 0, \"objects\": 0, \"kb_used\": 0}, \"name\": \"data\", \"id\": 0}, {\"stats\": {\"bytes_used\": 0, \"objects\": 0, \"kb_used\": 0}, \"name\": \"metadata\", \"id\": 1}, {\"stats\": {\"bytes_used\": 0, \"objects\": 0, \"kb_used\": 0}, \"name\": \"rbd\", \"id\": 2}], \"stats\": {\"total_used\": 63330648, \"total_space\": 125604864, \"total_avail\": 62274216}}}"
  </code></pre>
  
  <p>how can i format it to display nice formatted json ?</p>