JavaScript Предотвращение избыточного выбора и реализация кнопки удаления

Я реализую страницу, которая отображает информацию об опции, когда я выбираю опцию продукта, используя JavaScript. Мой исходный код прикреплен ниже. Если я выбираю опцию, я хочу отобразить информацию об опции, цену и название продукта, а если я нажимаю del_li_btn, я хочу удалить информацию об этой опции. Однако, согласно моему исходному коду, удаляется только цена. Что я должен сделать, чтобы удалить всю информацию, которую я разместил? Кроме того, я хочу реализовать опцию, которая будет выбрана только один раз. Если вы ответите на мой вопрос, я буду вам очень признателен. Я надеюсь на ваше любезное сотрудничество.

html

    <form method="POST" action="{% url 'zeronine:join_create' id=product.product_code %}">
        <div class="form-group row" style="margin-top: -5px">
            <label for="optionSelect" class="col-sm-6 col-form-label"><b>옵션</b></label>
                <div class="col-sm-6" style="margin-left: -90px;">
                     <select type="text" class="form-control" name="value_code" id="optionSelect" value="{{ form.value_code }}">
                         <option value="none">옵션을 선택하세요.</option>
                            {% for option in option_object %}
                               {% if option.option_code.option_code.option_code == value.option_code %}
                                   {%if option.product_code == product %}
                                       <optgroup label="{{option.name}}">
                            {% for value in value_object %}
                               {% if value.option_code.option_code == option.option_code %}
                                   {%if value.product_code == product %}
                                         <option data-price="{{value.extra_cost}}"value="{{value.value_code}}">{{value.name}} (+{{value.extra_cost}}원)</option>
                                   {% endif %}
                               {% endif %}
                            {% endfor %}
                                   {% endif %}
                               {% endif %}
                            {% endfor %}
                                     </optgroup>
                    </select>

                </div>
             <div id="selectOptionList" style="margin-top:10px; margin-left: 20px; margin-bottom: -10px;"></div>
        </div>

script (В конце строки есть кнопка del_btn_li.)

Вернуться на верх