Current event handlers is not setting or giving the value

[abishekmuthian]

Thank you carson and community

I have multiple select fields to select countries, if the user selects the same country in another select field then I show an alert and then set the value of that select field to default value.

    <div
      _="on every change in .country-select 
          set currentCountries to value of .country-select
          set alreadySetCountries to []
            repeat for country in currentCountries
              if country is in alreadySetCountries
                alert(`This country has already been selected`)
                set value of document.activeElement to 'Select Country'
              end
              append country to alreadySetCountries
            end
         "
    >
      <select class="select country-select" autocomplete="country" id="country" name="country">
        <option>Select Country</option>
        <option value="AF">Afghanistan</option>
        <option value="AX">Åland Islands</option>
        <option value="DZ">Albania</option>
        ...
    </select>

     <select class="select country-select" autocomplete="country" id="country" name="country">
        <option>Select Country</option>
        <option value="AF">Afghanistan</option>
        <option value="AX">Åland Islands</option>
        <option value="AL">Albania</option>
        ...
    </select>

    ...
</div>

I have to use document.activeElement in the above code to set or receive values because set value of me to 'Select Country' is not working.