update price according to quantity

I have a small problem with my buttons for a school project.
When I update the quantity by typing it in the form the price updates but when I try to change the quantity by clicking on my buttons it doesn’t work.
Here is the HTML (I used bootstrap 5)

<span id="price">6.99</span> 
<div class="num-block skin-5">
<div class="num-block skin-2 pt-2">
    <div class="num-in">
      <span class="minus dis" id="decrease" onclick="decreaseValue()"></span>
      <input type="number" id="qty" min="0" value="0"/>
      <span class="plus" id="increase" onclick="increaseValue()"></span>
    </div>
  </div>
</div>
<button id="changingprice" class="rounded buttonshad buttonstyling bg-primary text-light mx-5">Add $<span>0.00</span></button>

And here is the javascript

function increaseValue() {
value = parseInt(document.getElementById("qty").value, 10);
value = isNaN(value) ? 0 : value;
value++;
document.getElementById("qty").value = value;
}
function decreaseValue() {
value = parseInt(document.getElementById("qty").value, 10);
value = isNaN(value) ? 0 : value;
value < 1 ? value = 1 : '';
value--;
document.getElementById('qty').value = value;
}
let basePrice = document.getElementById("price").innerHTML;
document.querySelector("#qty").addEventListener("change", function(){
document.querySelector("#changingprice span").innerText = (basePrice * this.value).toFixed(2)
})

Hope someone can help me, have a good day !