Sometimes, we want to add options to select with JavaScript.
In this article, we’ll look at how to add options to select with JavaScript.
How to add options to select with JavaScript?
To add options to select with JavaScript, we can create new option elements and append them to the select element as its child.
For instance, we write
const min = 12;
const max = 100;
const select = document.getElementById("selectElementId");
for (let i = min; i <= max; i++) {
const opt = document.createElement("option");
opt.value = i;
opt.innerHTML = i;
select.appendChild(opt);
}
to select the select element with getElementById.
Then we create an option element in the for loop with createElement.
Then we set its value attribute by setting the value property.
Next we set its text content by setting the innerHTML property.
Finally, we call select.appendChild with opt to append the option into the select element.
Conclusion
To add options to select with JavaScript, we can create new option elements and append them to the select element as its child.
