Daniel Groppo Daniel Groppo - 1 month ago 5x
HTML Question

Mutiplying value in div with same class - JQuery

I have many div with the class .price (each one showing a different price) and I have a multiplying factor. When the user choose a radio with determined size, I want to automatically mutiply all prices.

I tried the following code, but it is changing for the multiplication of first .price child (All .price is receiving the same price):


How I can mutiply the value individually?


I've assumed the HTML based on your description in the question, Please try.

var factor = 0.5;
  factor = $(this).val();
function changePrice(){
$('.price').each(function() {
    $(this).html('$' + (parseFloat($(this).data('base-price')) * factor).toFixed(2));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<input type="radio" value="10" class="selectRadio" name="selectRadio"/>10
<input type="radio" value="20" class="selectRadio" name="selectRadio"/>20

  <li class="price" data-base-price="1.00"></li>
  <li class="price" data-base-price="2.00"></li>
  <li class="price" data-base-price="3.00"></li>
  <li class="price" data-base-price="4.00"></li>
  <li class="price" data-base-price="5.00"></li>
  <li class="price" data-base-price="6.00"></li>
  <li class="price" data-base-price="7.00"></li>
  <li class="price" data-base-price="8.00"></li>
  <li class="price" data-base-price="9.00"></li>