I can’t figure out how to make these into buttons using the array:
var widgetButtons = ["Zoom In", "Zoom Out", "Pan", "Search"]
Any help would be appreciated. This is my code I am attempting to use
<body>
<div id="demo"></div>
<script>
var widgetButtons = ["Zoom In", "Zoom Out", "Pan",
"Search"];
</script>
</body>
</html>
>Solution :
Here is another way to do it, using forEach().
IDs cannot contain spaces, so we remove the space from the item’s name/text before setting the id.
const widgetButtons = ["Zoom In", "Zoom Out", "Pan", "Search"]
const demo = document.getElementById('demo');
widgetButtons.forEach( (item, idx) => {
const btn = document.createElement('button');
btn.id = item.replace(' ', '');
btn.innerText = item;
demo.appendChild(btn);
});
<html>
<body>
<div id="demo"></div>
</body>
</html>