Map all divs values and do a math operation

2

I have the following structure:

<div class="product-price">
R$ 140,00
</div>
<div class="product-price">
R$ 165,30
</div>
<div class="product-price">
R$ 12,55
</div>
<div class="product-price">
R$ 25,22
</div>

Among other values that follow the same structure. However, I need to do a js function so that if the product value is less than $ 30, I will not be able to show the number of plots for this product. If it is greater than $ 30, I'll show you the number of plots.

My js structure is this:

function calculaParcelaHome(){
    var regex = /\d+,\d+/g;
    var texto = $(".product-price").text(); // pega o conteúdo da div Preco Avista no arquivo products.tpl
    var valor = regex.exec(texto); //converte a string para int
    var insereValor = parseFloat(valor.join("").replace(",",".")); // converte o valor para Float. 
    console.log(insereValor);

    if (insereValor >= 30) {
        $('.parcelas-produtos').css('display','block');
        console.log("Valor maior que 30");
    }else{
        $('.parcelas-produtos').css('display','none');
        console.log("Valor menor que 30");
    }
}

Only in my role, I can only do the operation for the first Div, and not for the others.

This is the structure of my plots:

<span class="parcelas-produtos">
                                {l s='3 x de'}
                                {if !$priceDisplay}{convertPrice price=$product.price /3}{else}{convertPrice price=$product.price_tax_exc}{/if}
                            </span>

How could you make this logic for the rest?

    
asked by anonymous 25.11.2016 / 14:52

1 answer

1

Put your code in a loop of elements you want, like this:

function calculaParcelaHome(){
  $('.product-price').each(function() {  
    var regex = /\d+,\d+/g;
    var texto = $(this).text(); // pega o conteúdo da div Preco Avista no arquivo products.tpl
    var valor = regex.exec(texto); //converte a string para int
    var insereValor = parseFloat(valor.join("").replace(",",".")); // converte o valor para Float. 
    console.log(insereValor);

    if (insereValor >= 30) {
        $(this).closest('div').find('.parcelas-produtos').show();
        console.log("Valor maior que 30");
    }else{
        $(this).closest('div').find('.parcelas-produtos').hide();
        console.log("Valor menor que 30");
    }
  });
}

calculaParcelaHome();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="product-price">
R$ 140,00
</div>
<div class="product-price">
R$ 165,30
</div>
<div class="product-price">
R$ 12,55
</div>
<div class="product-price">
R$ 25,22
</div>
    
25.11.2016 / 15:01