I am working on this increment function when the increment button is pressed that should add +1 to count element. This is my html:
<p id="count-el">0</p>
<button id="increment-btn" onclick="increment()">INCREMENT</button>
JS:
let countEl = document.getElementById('count-el');
function increment() {
countEl.textContent = countEl + 1;
}
You need to create a variable and then increment that variable in your increment function.
let count = 0;
let countEl = document.getElementById('count-el');
countEl.textContent = count;
function increment() {
count++;
countEl.textContent = count;
}
You can either use a 'count' variable to maintain count and display it after every increment. Or parse the number in the inner text to int and add.
This should work:
let countEl = document.getElementById('count-el');
function increment() {
countEl.textContent = parseInt(countEl.innerHTML) + 1;
}
Try this
let countEl = document.getElementById('count-el');
let count = 0;
function increment() {
count++;
countEl.textContent = count;
}
function decrement() {
count--;
countEl.textContent = count;
} <p id="count-el">0</p>
<button id="increment-btn" onclick="increment()">INCREMENT</button>
<button id="increment-btn" onclick="decrement()">DECREMENT</button>