Changing the text depending on the selected option

There is a list of options with a select and a div in which you need to change the text depending on the selected select option.

<select id="city_select" >
    <option>Select city...</option>
    <option value="from 1 day">NY</option>
    <option value="from 1 day">Toronto</option>
    <option value="from 7 day">Mexico</option>
</select>
<div id="delivery_cost"></div>

The first version of the script that came across on the internet was, in principle, not bad, but its disadvantage was that the value of the option value was monitored, which can be repeated, as in our list, and then the same value will be obtained for different cities of our example. In order to uniqueize changing text, you need to read not the value of the option, but the name

(function($){
	$(document).ready(function() {
		$('#city_select').change(function() {
			var selectedCity = $("#city_select option:selected").html();
			if(selectedCity == 'NY') {
				$("#delivery_cost").text( "10$" );
			}
		});
	});
});

In this example, we will be able to uniqueize and display different text depending on the option name and not its value.