Good day,

I'm very new to JSON data files.

What I want to achieve is:

Populate an iframe src"" with a URL that's in my JSON file

Here is the code I'm using (I got from another Stackoverflow question):

Javascript:

var jsonData=[{id:1,"url":"https://www.youtube.com/"}];
$(document).ready(function () {
$.getJSON('people.json', function (postImg) {
    if(data){
       data.forEach(function(i,o){
           var _div=$("<div/>",{id:o.id});
           _div.attr("url",o.url);
           _div.on('click',function(){
                $("#videoplayerDiv").attr("src", $(this).attr("url"));
           });
           $("#div1").append(_div)
       });
      }

   });
});

JSON (File name is: people.json)

    [
    {
        "id": "1",
        "firstName": "MJ",
        "lastName": "Doe",
        "postImg": "https://www.youtube.com/"
    }
]

HTML:

  <div class="div1" id='div1' style="padding-left:inherit">
    <iframe id="videoplayerDiv" src="" scrolling="no" frameborder="no" align="center" height="200px" width="500px" allowfullscreen></iframe>
  </div>

For some reason it's not working, Do I miss something?

Thanks