function updateSearchField() {
  var i = setInterval(function () {
    if (document.getElementById("deliveryGeoSearchField")) {
      clearInterval(i);
      // Replace the element with id 'deliveryGeoSearchField'
      var deliveryGeoSearchField = document.getElementById(
        "deliveryGeoSearchField",
      );
      var selectElement = document.createElement("select");
      selectElement.id = "deliveryGeoSearchField";
      selectElement.name = "deliveryGeoSearchField";
      selectElement.className = "snize-exclude-input";
      selectElement.style =
        "margin-bottom:0px; border-bottom-left-radius: 7px; height:100%; border-top-left-radius: 7px;";

      // Add options to the select element
      var cities = [
        "Wählen Sie Ihre Stadt",
        "London",
        "Milton Keynes",
      ];

      cities.forEach(function (city) {
        var option = document.createElement("option");
        option.value = city;
        option.text = city;
        selectElement.appendChild(option);
      });

      // Replace the existing element with the newly created select element
      deliveryGeoSearchField.parentNode.replaceChild(
        selectElement,
        deliveryGeoSearchField,
      );

      // Add event listener for 'change' event
      selectElement.addEventListener("change", function () {
        selectElement.disabled = true;

        // Perform actions when the select value changes
        document.getElementsByClassName("searchIcon")[0].parentNode.dispatchEvent(new KeyboardEvent('keyup',{'key':'Enter'})); 


        // Replace the searchIcon element with a refresh element
        var searchIcon = 
document.getElementsByClassName("searchIcon")[0];
        var refreshElement = document.createElement("div");
        refreshElement.id = "refresh";
        refreshElement.style = "color:black";
        refreshElement.innerHTML = "✕";

        // Add event listener for 'click' event on the refreshElement
        searchIcon.parentNode.addEventListener("click", function () {
          window.location.reload();
        });

        // Replace the searchIcon with the refreshElement
        searchIcon.parentNode.replaceChild(refreshElement, searchIcon);
      });
    }
  }, 500);
}

ZapietEvent.listen("selected_method", function () {
  updateSearchField();
});

updateSearchField();

#deliveryGeoSearchField {
        flex-grow: 1 !important;
}