Change Content - Javascript

Change html element content using pure javascript author(s): Deepu Mohan Puthrote (WarFox)

HTML

<select name="city" class="city" id="city-selection">
    <option selected="selected" value="">Select City</option>
    <option value="City 1">City 1</option>
    <option value="City 2">City 2</option>
    <option value="City 3">City 3</option>
    <option value="City 4">City 4</option>
    <option value="City 5">City 5</option>
    <option value="City 6">City 6</option>
    <option value="City 7">City 7</option>
</select>

JavaScript

const selectCites = document.getElementById("city-selection");

selectCites.addEventListener("change", function(e) {
	e.preventDefault();

	const { srcElement } = e;
	const { selectedOptions } = srcElement;

	for (let i = 0; i < selectedOptions.length; i++) {
    console.log(selectedOptions[i].value);
    console.log(selectedOptions[i].text);
  }
})