How to put ArrayList inside a list HTML-CodePudding

Hello everyone i am trying to put some elements from an ArrayList JS to a HTML list.

I tried a lot of codes from Google but still not working.

Here is my code:

<ul id="myList"></ul>

and the Javascript part:

    let list = document.createElement("list");
let data = ["Old Fashioned", "Negroni", "Daiquiri", "Dry Martini", "Margarita", "Espresso Martini", "Whiskey Sour", "Aperol Spritz", "Mojito", "Bloody Mary"];
let list = document.getElementById("myList");
data.forEach((item)=>{
  let li = document.createElement("li");
  li.innerText = item;
  list.appendChild(li);
})

Nothing appears on the HTML page.

CodePudding user response：

Try EJS: https://ejs.co/.

EJS is a simple templating language that lets you generate HTML markup with plain JavaScript. It should be fine with this. It is very simple to use. You will see

CodePudding user response：

Your code seems to work fine as it is. If it doesn't, then something else on your page is interfering.

let data = ["Old Fashioned", "Negroni", "Daiquiri", "Dry Martini", "Margarita", "Espresso Martini", "Whiskey Sour", "Aperol Spritz", "Mojito", "Bloody Mary"];
let list = document.getElementById("myList");
data.forEach((item) => {
  let li = document.createElement("li");
  li.innerText = item;
  list.appendChild(li);
})

<ul id="myList"></ul>