JQuery, как удалить все option из select

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
  <select onchange="myFun(this.options[this.selectedIndex].value)">
    <option value="" disabled selected></option>
    <option value="1">Text1</option>
    <option value="2">Text2</option>
  </select>

  <select id="mySelect">
    <option value="" disabled selected></option>
    <option value="1">Text1</option>
    <option value="2">Text2</option>
  </select>

  <legend>Поиск</legend>
  <p><input type="submit" value="Искать"></p>
</form>

<script>
  function myFun(id) {
    $('#mySelect').find('option').remove();
  }
</script>

После выбора любого пункта из первого селекта, значения из второго не изменяются - точнее в отладчике они удаляются, а в форме нет. Тоже происходит и при попытке добавить новые пункты во второй селект.

Как быть?


Ответы (2 шт):

Автор решения: Igor

в отладчике они удаляются, а в форме нет

Так не бывает. У Вас на странице несколько элементов с id="mySelect".

→ Ссылка
Автор решения: an_parubets

Используй метод .empty() для очистки контейнера:

 $('#mySelect').empty();
→ Ссылка