I want to combine google sheet with my website. My idea is when I update data in my published google sheet, the HTML div tag with a certain id (the content of divID column in my sheet) will automatically fill in the data to it. For example, So, if I create a div with id="K800",the model number, like <div id="K800"></div>, then it will fill in a <p> with the data into the div, just like this:

<div id="K800">

  <p>Model Number: K800     Product Name: Large Gripper     Manufacturer: Niryear</p>

</div>

I'm not familiar with jQuery, but I want to know how to finish the following code to fit my need. I want to put one colume of data to a div each time, instead of display all data at once.

<script>

    $(function(){

      var googleSpreadsheetID = "GGCdBbgycygSrnCYzjdGuIERcLc";

      var workSheet = "od6"; // First sheet is always "od6"

      var url = " https://spreadsheets.google.com/feeds/list/" + googleSpreadsheetID + "/" + workSheet + "/public/values?alt=json";

      $.getJSON(url, function(data){

        //Get all entries from the google sheet

        var entries = data.feed.entry;

        var mySheet = [];

        // alert(entries.length);

        // Store call data into an array

        for (var i = 0; i < entries.length; i++) {

          mySheet[i] = { // change animal or other item names

            "field1" : entries[i].gsx$divID.$t,

            "field2" : entries[i].gsx$Model Number.$t,

            "field3" : entries[i].gsx$Product Name.$t,

            "field4" : entries[i].gsx$Manufacturer.$t

          }           

        }

//for this part, I don't know what to do to ...         

      });

    })

</script>