Clear Select2 selection onclick

Question

I have two inputs, one with id="zip" and one with id="city".

#city is a Select2 dropdown.

I'm trying to clear the selected value onclick of #zip.

I tried using this;

$("#zip").click(function() {
  $("#city").empty;
});

and this;

$("#zip").click(function() {
  $("#city").select2('data', null);
});

But neither seem to work (or a few other variations, I've tried).

I just want to clear the select2 value (I even have a blank value data-select2-id="2" which I am open to switch the selection too).

Answer 1

I got it to work using this answer

$("#city").val('').trigger('change')

I guess I had to add trigger('change')

Result:

$("#zip").click(function() {
  $("#city").val('').trigger('change')
});