Dynamic Text under Product Price on Product page in case a variation is selected

Question

How can I create a text A under the product price on the product page in case a variation is not selected. When a variation is selected I would like to have another text B. To be exact: Text A: incl. VAT free premium shipping Text B: incl. VAT + free premium shipping(in black color and bold).

The text should go under the price.

Thank you very much.

Answer 1

You can do that with javascript exemple :

function AddTVA(){
  var checkBox = document.getElementById("myCheck");
  var text = document.getElementById("text");
  if (checkBox.checked == true){
    document.getElementById("price").innerHTML = "12.00";
  } else {
    document.getElementById("price").innerHTML = "10.00";
  }
}

<div>
  <h2>Product name</h2>
  <p><span id="price">10.00</span>$</p>
  <input type="checkbox" id="myCheck" onclick="AddTVA()"/>
  <label for="myCheck">Add TVA</label>
</div>