Как изменить цену при нажатии на цвет в Django с помощью Jquery?

Я пытаюсь изменить цену моего продукта в зависимости от выбора цвета, у меня есть 6 цветовых кодов на странице просмотра продукта, и я выбираю цвет, но цена не меняется, это работает идеально с выпадающим списком. Не мог бы кто-нибудь помочь мне изменить цену в зависимости от выбора цвета.

Вот мой код:

                     <div class="pr_switch_wrap tranactionID">
                                <span class="switch_lable">Color</span>
                                <div class="product_color_switch tranactionID">
                                    {% for size in product.STOREPRODUCTSKU.all %}
                                    <span data-color="{{size.variantcolor.color_code}}" class="price_value" id="{{size.variantcolor.id}}" title="{{size.variantcolor.name}}"  style="background-color: rgb(51, 51, 51); width: 23px; height: 23px;"></span>
                                    {% endfor %}
                                </div>
                            </div>
                            <div class="pricing">
                                <p class="price"><span class="mr-2 price-dc">Rs. </span><span class="price-sale" id='id_price'>Rs. </span></p>
                            </div>

и вот код jquery...

<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script>
    $(document).on("click", '.tranactionID', function(event) {
      event.preventDefault();
      console.log($('#id_price').text($(this).children(":selected").attr("price")));
  
    });
  </script>

Пожалуйста, помогите мне с этим.

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