Удалить дубликат опции из выбора (с множественным выбором на одной странице) jQuery

Question

Ниже мой jQuery код. Это работает для первого выбора страницы, но не для других. Опции другого выбора удалены, и я не могу понять, почему.

Вот ссылка на одну из заинтересованных страниц (нажмите на большие блоки, чтобы увидеть выпадающий список): мой сайт

Заранее благодарим за потраченное на мою проблему время.

var city = {};

$('.ville-select option').each(function() {
  var val = $(this).val();
  if (city[val]) {
    $(this).remove();
    return;
  }
  city[val] = 1;
});

Answer 1

Поскольку у вас есть несколько вариантов выбора на одной странице, вам нужно будет перебрать каждую из них для обработки дубликатов:

// Iterate through each select boxes
$('.ville-select').each(function() {
  var city = {};
  $(this).find('option').each(function() {
    var val = $(this).val();

    if (city[val]) {
      $(this).remove();
      return;
    }

    city[val] = 1;
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="ville-select">
  <option value="a">a</option>
  <option value="b">b</option>
  <option value="a">a</option>
</select>
<select class="ville-select">
  <option value="a">a</option>
  <option value="b">b</option>
</select>