Javascript object help (json and ajax)

Question

I'm currently using Ajax to pull data from my Json file... my situation is that in one div of my html i need to add a heading and paragraph..

I tried to make a property such as "headingpara": "<h1> blah blah </h1> <p> blah blah blah </p>" With this i get an error.

i also tried to do

"heading": "<h1> blah blah </h1>",
"para": "<p> blah blah blah </p>"

and then in my javascript call both properties with ["heading", "para"] but it only shows the paragraph and not the heading..

how can i put both the h1 and p tags side one div using this?

Answer 1

You can use the property innerHTML to concat your HTML strings building the content of the target div.

var ajaxresponse = {
"heading": "<h1> blah blah </h1>",
"para": "<p> blah blah blah </p>"
};

document.querySelector('#target_div').innerHTML = ajaxresponse.heading+ajaxresponse.para;

<div id="target_div"></div>