You can loop through your produto-text-price
div to get price all items which is added to cart then use split and replace commas .Finally, add total price in some div .
Demo Code :
function addProd(number) {
var product_id = 'prod' + number;
var prod = document.getElementById(product_id).innerText;
var productPreco = id = 'prodPreco' + number;
var prodPreco = document.getElementById(productPreco).innerText;
var divProd = document.createElement('div');
divProd.className = 'produto-in';
document.getElementById('cesta-in').appendChild(divProd);
var prodText = document.createElement('div');
prodText.className = 'produto-text';
var prodText2 = document.createElement('div');
prodText2.className = 'produto-text-price';
divProd.appendChild(prodText);
divProd.appendChild(prodText2)
prodText.innerHTML = prod;
prodText2.innerHTML = prodPreco;
var price = 0;
//loop through price div inside cart
document.querySelectorAll('.produto-text-price').forEach(function(el) {
//split from `$`
var totals = el.textContent.split('$')[1]
var numbers = totals.replace(/,/g, '') //replace comma
price += Number(numbers) //add
})
document.getElementById("totalprice").innerHTML = "U$" + addCommas(price); //put result inside totalprice
}
function addCommas(value) {
return value.toString().replace(/B(?=(d{3})+(?!d))/g, ",");
}
.produtos {
min-width: 80%;
width: 80%;
}
.prod {
width: 25%;
padding: 20px;
}
.prod p {
margin: 0;
}
/*-- SHOPPING CART --*/
#cesta {
max-width: 20%;
width: 20%;
display: flex;
flex-direction: column;
}
.produto-in {
display: flex;
justify-content: space-between;
align-items: center;
margin: 0;
padding: 0;
}
.produto-in div {
font-size: 14px;
width: 100%;
}
<div class="container container-produtos-geral d-flex">
<div class="produtos d-flex justify-content-start flex-wrap text-center">
<div class="prod">
<p id="prod1">Abc</p>
<p id="prodPreco1">U$5,99</p>
<button type="button" onclick="addProd('1')">Add to Cart</button>
</div>
<div class="prod">
<p id="prod2">Abcd</p>
<p id="prodPreco2">U$14,99</p>
<button type="button" onclick="addProd('2')">Add to Cart</button>
</div>
<div class="prod">
<p id="prod3">Abcd</p>
<p id="prodPreco3">U$143,99</p>
<button type="button" onclick="addProd('3')">Add to Cart</button>
</div>
</div>
<div id="cesta">
<div class="title">Cart</div>
<div class="produto-in">
<div id="cesta-in">
<!-- CLICKED PRODUCTS -->
</div>
</div>
<div>Total Price : <span id="totalprice"></span></div>
</div>
</div>