如何在HTML中显示值

Today I am using ajax to get an external api value and display it in html, but fetching the value from ajax was successful, but I don't know how to display it, so I leave a question.

The code below is what is called as json value from external api.

{
    "addr": "address",
    "code": "38807050",
    "created_at": "2020/03/28 13:15:00", 
    "lat": x axis, 
    "lng": y axis, 
    "name": "store name", 
    "remain_stat": "1", 
    "stock_at": "2020/03/28 11:37:00", 
    "type": "01"
 }

I want to make the json value called from the external api look like the picture below. How can I get the value called there?

enter image description here

           <div class="row pt-4 px-5 moreBox" style="display: none;">
            <div class="pb-5 col-md-5">
              <iframe width="100%" height="300" src="https://maps.google.com/maps?q=New%20York&amp;z=14&amp;output=embed" scrolling="no" frameborder="0"></iframe></div>
            <div class="col-md-6">
              <h1 class="">store name</h1>
              <p class="lead">address</p>
              <h5 class="">created at</h5>
              <h6 class="">stock_at</h6>
            </div>
          </div>

Hi you need to make an javascript file and than dynamically handle the html from .js file.I implement this using click listener you can set it according to your choice. I think following code will help you to get the point.

e.g In Html file

            <div class="col-md-6" id="datatoload">
            </div>

In script file

document.getElementById('datatoload').addEventListener('load', loadData);
function loadData() {
 // Create the object
 const xhr = new XMLHttpRequest();

 // Open the connection
 xhr.open('GET', '<URL>', true);

 // Execute the function
 xhr.onload = function() {
      if(this.status === 200) {
           // Get the response as an Object
           const data = JSON.parse( this.responseText );

           let output = '';
           data.forEach(function(d) {
                output += `

                          <h1 class="">${d.name}</h1>
                          <p class="lead"> ${d.addr}</p>
                          <h5 class="">${d.created_at}</h5>
                          <h6 class=""> ${d.stock_at}</h6>

                `;
           });

           document.getElementById('datatoload').innerHTML = output;

      }
 }

 // Send the request
 xhr.send();

}

You can simply try this code