Удалить выбранный атрибут, если другой выбор был изменен, с помощью Bootstrap Select

Question

Я хочу удалить selected атрибут из select если его брат select меняет его option, В обычном jQuery этот код работает как обычно. Смотрите эту скрипку: https://jsfiddle.net/hv0x43em/1/

Тем не менее, я также использую Bootstrap Select.

С помощью Bootstrap Select, selected атрибут, кажется, не удаляется. Вот моя скрипка и код: https://jsfiddle.net/L71xtwx3/2/

$(document).ready(function() {
  $(".charts-city").on('change', function(e) {
    var dataOptions = $(this).closest(".form-group").next().find(".charts-data option");
    $(dataOptions).prop("selected", false);
    e.preventDefault();
  });
});

Есть идеи, как с этим работать?

Answer 1

Согласно вашему демонстрационному коду jsfiddle вы выбираете неверный класс charts-provinsi вместо charts-city.

вот рабочий код

$(document).ready(function() {
    $(".charts-city").on('change', function(e) {
$(".charts-data").val('0');
$(".charts-data").selectpicker("refresh");
    });
});

вот реферальная ссылка https://silviomoreto.github.io/bootstrap-select/methods/

вот рабочая демоверсия https://jsfiddle.net/L71xtwx3/6/