We come across many situations where we need to display JSON string (pretty/Style/Indent format) inside HTML DIV(<div></div>) tag. The below Javascript code snippet can be used to achieve what you need.
HTML Code
<pre id="json"></pre> //DIV tag wont work
Javascript Code
var data = { "data": { "attribute1": "value1", "attribute2": "value2", }, "attribute3": "value3" }; document.getElementById("json").innerHTML = JSON.stringify(data, undefined, 2); OR $("#json").html(JSON.stringify(data, undefined, 2)); // For jQuery
Output
{ "data": { "attribute1": "value1", "attribute2": "value2" }, "attribute3": "value3" }
If you want to indent more, increase the value 2 in function JSON.stringify().