[Solved] How to foreach JSON to HTML ul li [duplicate]


With vanilla JS, you can loop through the array with the forEach method and construct the li elements accordingly.

var data = {
    "gists": [
        {
            "name": "Get the title",
            "id": "beaf8a106e76f4bb82a85ca3a7707a78",
            "category": "Function"
        },
        {
            "name": "Get the content",
            "id": "c6ae7c55aa27f8b6dbeb15f5d72762ec",
            "category": "Uncategorized"
        }
    ]
};

var container = document.querySelector('#container');
var ul = document.createElement('ul');

data.gists.forEach(function (item) {
  var li = document.createElement('li');

  li.textContent="Name: " + item.name + ', ID: ' + item.id + ', Function: ' + item.category;
  ul.appendChild(li);
});

container.appendChild(ul);
<div id="container"></div>

solved How to foreach JSON to HTML ul li [duplicate]