JSFiddle - React, Tailwind, and code Playground

HTML

<div class="selected-items"></div>
<select id="cities">
    <option value="NewYork">NewYork</option>
    <option value="LasVegas">LasVegas</option>
    <option value="Boston">Boston</option>
    <option value="LA">LA</option>
</select>

<select id="radius">
    <option value="5">5</option>
    <option value="10">10</option>
    <option value="15">15</option>
    <option value="20">20</option>
</select>

<button type="button" id="addCity">add city</button>

JavaScript

var cities = [];

//onclick
$("#addCity").on("click", function(){
	var selectedCity = $("#cities").val();
	var selectedRadius = $("#radius").val();
	//newCity = selectedCity + ", " + selectedRadius;
    
    newCity = new Object;
    newCity.cityName = selectedCity;
    newCity.cityRadius = selectedRadius;
    
    var cityAlreadyAdded = false;
    var i = cities.length;
    
    while(i--){
        if (cities[i].cityName == selectedCity)
        {
            alert("Du har allerede tilføjet "+ cities[i].cityName);
            cityAlreadyAdded = true;
            break;
        }
    }
    
    console.log(cities);
    if (!cityAlreadyAdded)
    {
        cities.push(newCity);
        
        $('<button>', {
            text:'remove', 
            id:selectedCity
        }).addClass('remove-button').appendTo('.selected-items');
    }
});

$(document).on("click", ".remove-button", function(){
    alert($(this).attr("id"));
});