Удаление опции с определенным текстом из выпадающего меню

В моем приложении Django (использующем {% load crispy_forms_tags %}) есть следующее выпадающее меню:

<div id="div_id_report_division" class="form-group">
<label for="id_report_division" class=" requiredField">Test<span class="asteriskField"></span</label>
<div class="">
<select name="report_division" class="select form-control" required="" id="id_report_division">
  <option value="" selected="">---------</option>
  <option value="1">A</option>
  <option value="2">B</option>
  <option value="3">C</option>
  <option value="4">D</option>
  <option value="5">E</option>
</select> </div> </div>

Я хочу убрать опцию номер 5 при загрузке страницы. Мой Javascript на post.html со всем: 

     <script type="text/javascript">
         function on_load(){
            /*
            option 1.:
            document.querySelector('id_report_division option[value=5]').remove();
            option 2.:
            var x = document.getElementById('id_report_division');
            x.remove(5);
            option 3.:
            document.querySelector('#id_report_division option[value=5]').remove();
            const first = document.querySelector("[id='id_report_division']");
            */

            document.querySelector("[id='id_report_division' option[value=5]]").remove();

            }
         on_load();
    </script>

Как я могу легко удалить эту опцию? Было бы лучше, если бы я мог удалить опцию, где текст является E, в случае, если значение изменится. Но всегда будет только один текст 'E', нет необходимости в итерации.

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

var selectobject = document.getElementById("id_report_division");
for (var i=0; i<selectobject.length; i++) {
    if (selectobject.options[i].text == 'E')
        selectobject.remove(i);
}
Вернуться на верх