I have an application where the user selects the words he will save. I write all these words into an array. I need to display each element of this array in a column so that when hovering over you could see the information (or by clicking)
I tried to iterate over each element of the array using for and foreach but only the last element was displayed
How can I arrange array elements in a column?
Array:
let a = ["First word","Second word","Third word"]
An example of what I need:
Need to display it on the page through textContent or innerHTML or something like that.
What you can do is initializing a list and the adding dynamically all items to that list.
const words = ["First word","Second word","Third word"]
const list = document.getElementById('myList')
words.forEach(word => {
const item = document.createElement('li')
item.textContent = word // or item.innerHTML
list.appendChild(item)
})
<ul id="myList"></ul>
for in:let a = ["First word","Second word","Third word"],
$list = document.querySelector('#list')
for(let i in a) {
$list.insertAdjacentHTML('beforeend', `<li>${a[i]}</li>`)
}
<ol id="list">List of items
</ol>