Trying to add two value and insert them in HTML as a paragraph

September 23, 2022

I’m currently trying to make this code work properly.

I think the problem is within the two last line of my code, but I don’t understand why it doesn’t work. Can’t I add those two value and just insert the result in my HTML ?

const option1=document.getElementById("checkbox1")
const option2=document.getElementById("checkbox2")
const option3=document.getElementById("checkbox3")
let priceFirstMonth = 19.95;
let priceAnnual = 29.95;
const setPriceMonth = document.querySelector(".firstMonthPrice");

const calculatedPrice = () => {
    /* calculate the amount of all options */
    let addedOptionsPrice;
    if (option1.checked) {
        addedOptionsPrice = addedOptionsPrice+10;
    }
    if (option2.checked) {
        addedOptionsPrice = addedOptionsPrice+5;
    } 
    if (option3.checked) {
        addedOptionsPrice = addedOptionsPrice+10;
    }

    /* add the amount to regular prices*/
    priceFirstMonth = document.createElement('p');
    priceAnnual = document.createElement('p');
    priceFirstMonth.innerHTML = priceFirstMonth + addedOptionsPrice;
    priceAnnual.innerHTML = priceAnnual + addedOptionsPrice;
    setPriceMonth.appendChild(priceFirstMonth);

}

Thanks in advance for any help or explication on my behavior !

>Solution :

priceFirstMonth = document.createElement('p');
priceAnnual = document.createElement('p');
priceFirstMonth = priceFirstMonth + addedOptionsPrice;
priceAnnual = priceAnnual + addedOptionsPrice;
setPriceMonth.innerHTML=priceFirstMonth;