How do I dynamically populate html elements with JSON Data with Javascript not jQuery?

Question

I have this following JSON data snippit:

{\"items\": [
 {
   \"title\": \"sample 1\",
   \"author\": \"author 1\"
 },
 {
  \"title\": \"sample 2\",
  \"aut         


        

Answer 1

I've found that the most reliable way to create DOM elements is using the element.innerHTML property. Basically you'd have a DIV or SPAN at the place at the place on the page where you want to render the new HTML. Then you'd grab that span in javascripting using document.getElementById("DIV-ID") and then set the innerHTML property of the DIV to the new HTML that you would generate from the JSON object. There are a bunch of other JavaScript functions to create elements, but I've found that they're not always reliable and don't always have the best cross-browser support.

http://www.w3schools.com/jsref/prop_html_innerhtml.asp