Javascript Restaurant Guests counting app

[mmilevoj]

Hello everybody. I am trying to build a simple app which counts how many guests have entered the restaurant and then logs it put. I keep getting, wrong result. For example: 5+5= 55 instead of 10. Here is my javascript code:

let saveEl = document.getElementById("save-el")
let countEl = document.getElementById("count-el")
let totalEl = document.getElementById('total-el')
let count = 0

function increment() {
    count += 1
    countEl.textContent = count
}


function save() {
    let separator = '-'
    let countStr = `${count}  ${separator}`;
    saveEl.textContent += countStr;
    let a = [countStr];
    for(let i=0; i<a.length;i++){
        a[i]= a + count;
    }
    totalEl.textContent = a;
    countEl.textContent = 0
    count = 0;
    
}

[kevinSmith]

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

[kevinSmith]

What is the type of the data that you are getting off the DOM?

And consider these:

console.log(5 + 5)
console.log('5' + 5)
console.log(5 + '5')
console.log('5' + '5')

What do they evaluate to?

[nkp1111]

if 5 + 5 answers 55 instead of 10 it must be string instead of integer
“5” + “5” = “55”
5 + 5 = 10
You should convert variable to integer or float first

[mmilevoj]

Thank you for you kind suggestions. At the end, I have solved the problem like this:

function increment() {
  counter++;
  document.getElementById('count-el').innerHTML = counter;
}

function save() {
  let saved = document.createElement('span');
  let separator = ' - ';
  saved.innerHTML += `${counter}  ${separator}`;
  document.getElementById('save-el').appendChild(saved);
  counter = 0;
  counter.innerHTML= 0;
}

function total() {
  let total = 0;
  let saved = document.getElementById('save-el').children;
  for (let i = 0; i < saved.length; i++) {
    total += parseInt(saved[i].innerHTML, 10);
  }
  document.getElementById('total-btn').innerHTML = total;
} ```