Review: Building a List

Data:

{
    "apples" : ['Macoun', 'Empire', 'Honey Crisp', 'Albemarle Pippin']
}
     

JavaScript:

function makeApplesList() {
 ul_node = document.createElement("ul");
 let mydata= {"apples" : ['Macoun','Empire','Honey Crisp','Albemarle Pippin']};
 let itemlist = mydata.apples;
 for (i in itemlist) {
     let mytext = itemlist[i];
     let text_node = document.createTextNode(mytext);
     let li_node = document.createElement("li");
     li_node.appendChild(text_node);
     ul_node.appendChild(li_node);
 };
 let container = document.getElementById("itemlistcontainer");
 container.appendChild(ul_node);
}

Invoking the script with a "click" event:

<button onclick="makeApplesList();">Build List of Apples</button>

Entire Example:

 
 <div id="itemlistcontainer">
   <button onclick="makeApplesList();" type="submit">Build List of Apples   </button>
 </div>

function makeApplesList() {
   ul_node = document.createElement("ul");
   let mydata= {"apples" : ['Macoun','Empire','Honey Crisp','Albemarle Pippin']};
   let itemlist = mydata.apples;
   for (i in itemlist) {
       let mytext = itemlist[i];
       let text_node = document.createTextNode(mytext);
       let li_node = document.createElement("li");
       li_node.appendChild(text_node);
       ul_node.appendChild(li_node);
   };
   let container = document.getElementById("itemlistcontainer");
   container.appendChild(ul_node);
}