tengo esta estructura:
<div class="gs-item-price"> <span class="gs-old-price">5,00</span><br> <span class="gs-new-price">1,00</span><br> </div> <br> <span class="value1"></span> % <br> <br> <div class="gs-item-price"> <span class="gs-old-price">10,00</span><br> <span class="gs-new-price">5,00</span><br> </div> <br> <span class="value1"></span> %Necesito calcular y visualizar el porcentaje de descuento.
He escrito el siguiente código:
var OldPrice=$('.gs-old-price').html().replace(/,/g,'.'); var NewPrice=$('.gs-new-price').html().replace(/,/g,'.'); var oldPriceNum= parseFloat(OldPrice); var newPriceNum= parseFloat(NewPrice); var percent= oldPriceNum - newPriceNum; var percent1= percent/oldPriceNum; var percent2=percent1*100; var finalPercent=parseFloat(percent2).toFixed(0); document.querySelector('.value1').innerHTML = finalPercent;Que visualice solo el primer valor del porcentaje.
¿Cómo puedo revisar todos los divs y obtener el porcentaje correcto? toda ayuda sera buena
Moví ambos <span class="value1"></span> % al <div class="gs-item-price"> apropiado y luego llamé a cada uno . También cambié la colocación de finalPercent . Ver el fragmento:
$('.gs-item-price').each(function() { var OldPrice=$(this).find('.gs-old-price').html().replace(/,/g,'.'); var NewPrice=$(this).find('.gs-new-price').html().replace(/,/g,'.'); var oldPriceNum= parseFloat(OldPrice); var newPriceNum= parseFloat(NewPrice); var percent= oldPriceNum - newPriceNum; var percent1= percent/oldPriceNum; var percent2=percent1*100; var finalPercent=parseFloat(percent2).toFixed(0); $(this).find('.value1').html(finalPercent) }) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="gs-item-price"> <span class="gs-old-price">5,00</span><br> <span class="gs-new-price">1,00</span><br> <br> <span class="value1"></span> % <br> </div> <br> <div class="gs-item-price"> <span class="gs-old-price">10,00</span><br> <span class="gs-new-price">5,00</span><br> <br> <span class="value1"></span> % </div>