I’m trying to create an interactive menu from JSON data, so ultimately I want every item represented as a button. I’m having a lot of trouble converting the data to an HTML button.

The JSON data has been validated. I won’t post all of it because it’s over 1000 lines, but that doesn’t seem to be part of the problem.

Below is my most recent attempt at using appendChild() and a for loop:

breakfast = {     "Breakfast": [{           "Pancakes": [{               "item": "1 Pancake",               "price": 2.00,                "add-ons": {                 "blueberries": {                   "add-on price": 0.50                 },                 "chocolate chips": {                   "add-on price": 0.50                 },                 "M&Ms": {                   "add-on price": 0.50                 },                 "Strawberry Topping": {                   "add-on price": 0.50                 }               }             },             {               "item": "2 Pancakes",               "price": 3.00,                "add-ons": {                 "blueberries": {                   "add-on price": 0.50                 },                 "chocolate chips": {                   "add-on price": 0.50                 },                 "M&Ms": {                   "add-on price": 0.50                 },                 "Strawberry Topping": {                   "add-on price": 0.50                 }               }             },             {               "item": "3 Pancakes",               "price": 4.00,                "add-ons": {                 "blueberries": {                   "add-on price": 0.50                 },                 "chocolate chips": {                   "add-on price": 0.50                 },                 "M&Ms": {                   "add-on price": 0.50                 },                 "Strawberry Topping": {                   "add-on price": 0.50                 }               }             },             {               "item": "4 Pancakes",               "price": 5.00,                "add-ons": {                 "blueberries": {                   "add-on price": 0.50                 },                 "chocolate chips": {                   "add-on price": 0.50                 },                 "M&Ms": {                   "add-on price": 0.50                 },                 "Strawberry Topping": {                   "add-on price": 0.50                 }               }             }           ],          }  //Snippet of massive JSON data  menuStart = document.getElementById("menuStart") //where the menu is placed on the page function initiateBreakfast() {   for (i = 0; i < data.length; i++) {     var myJSON = JSON.stringify(breakfast);     var node = document.createElement("BUTTON");     var textnode = document.createTextNode(myJSON[i]);     node.appendChild(textnode);     menuStart.appendChild(node);     console.log(breakfast);   } } 

Thank you for any help or insight.