Solo quiero calcular el precio de todos los productos.
function getComboA() { var price = parseFloat($(".original-price").html()); var korting = (Math.round((price - ((price) / 100) * 10))); $(".discount").html("$" + korting + ""); } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6./jquery.min.js"></script> <div>$<span class="original" onload="getComboA()" ;>100</span> $<span class="discount"></span></div> <div>$<span class="original" onload="getComboA()" ;>100</span> $<span class="discount"></span></div> <div>$<span class="original" onload="getComboA()" ;>100</span> $<span class="discount"></span></div> <div>$<span class="original" onload="getComboA()" ;>100</span> $<span class="discount"></span></div> <div>$<span class="original" onload="getComboA()" ;>100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original" onload="getComboA()" ;>100</span> $<span class="discount"></span></div> <div>$<span class="original" onload="getComboA()" ;>100</span> $<span class="discount"></span></div>Los tramos no tienen onload
Tal vez quisiste decir esto
$(function() { // on page load $(".discount").each(function() { const price = +$(this).closest("div").find(".original").text(); const korting = (Math.round((price - ((price) / 100) * 10))); $(this).text(korting) }) }) <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div>Cambios en el lápiz de pestañas
https://codepen.io/mplungjan/pen/RwLadvW
$(function () { // on page load const setPercentage = (e) => { let id; // why is this even neessary. Seems the active is not set on click if (e) { e.preventDefault(); id = $(e.target).attr("id") } else id = $("[data-toggle=pill].active").attr("id"); const percentage = parseInt( $("#" + id.replace("-tab","")).text() ); $(".discount").each(function () { const price = +$(this).closest("div").find(".original").text(); const korting = Math.round(price - (price / 100) * percentage); $(this).text(korting); }); }; $("#pills-tab").on("click","[data-toggle=pill]",setPercentage) setPercentage(); });En lugar de llamar a la función en cada span , lo que no es válido, lo que puede hacer es simplemente llamar a la función en su contenedor. En mi ejemplo que se muestra a continuación, body es mi contenedor. Puede recorrer las etiquetas usando sus nombres de clase y obtener la cantidad original y realizar las operaciones matemáticas requeridas. Aquí está el ejemplo:
<html> <body onload="getComboA()"> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <div>$<span class="original">100</span> $<span class="discount"></span></div> <script> function getComboA() { var sum = 0; var originals = document.getElementsByClassName("original"); var discounts = document.getElementsByClassName("discount"); for(var i = 0; i < originals.length; i++){ var originalPrice = parseFloat(originals[i].innerHTML); discounts[i].innerHTML = (Math.round((originalPrice - ((originalPrice) / 100) * 10))); } } </script> </body> </html>