increase a number when click a button

Question

I want to write Javascript code which can increase a number when we click a button.Can you help me? I tried this but it doesn't work.

var document.getElementById("par").innerHTML = i;
        function sum(){
            i++;
        }

<p id="par">1</p>
<img onclick="sub()" height="40px" width="40px" src="sub.png">

Answer 1

const button = document.querySelector("#increaser");
const res = document.querySelector("#result");

button.addEventListener("click", () => {
  res.textContent++
});

<div>
    <p id="result">1</p>
    <button id="increaser">Add</button>
</div>

Answer 2

You need to update the innerHTML upon updating the value in sum function.

let i = 1;

document.getElementById("par").innerHTML = i;

function sum() {
  i++;
  document.getElementById("par").innerHTML = i;
}

<p id="par">1</p>
<img onclick="sum()" height="40px" width="40px" src="sub.png">