Javascript += equivalent?

Question

My code is a simple function that checks which radio button was pressed, and adds the value of that radio button to my var input = 0;. However, I know I am doing something wrong as it works but the output is wrong. When one of the if statements is true, instead of input(0) now being equal to itself plus the new value of the getElementById("small").value, it prints out 010 as opposed to the now 10.

I know in Java there was a convention similar to input += getElementById("small").value; but this doesn't seem to work. So as you can see in my example below, I tried the alternative of input = input + /*code*/; but still no luck.

I am new to JavaScript but very familiar with Java. I imagine I'm just using the wrong syntax here but all my Google searches are a bust.

function calculate()
{
    var input = 0;
    if (document.getElementById("small").checked) 
    {
        input = input + document.getElementById("small").value;
    }
    else if (document.getElementById("medium").checked)
    {
        input = input + document.getElementById("medium").value;
    }
    else if (document.getElementById("large").checked)
    {
        input = input + document.getElementById("large").value;
    }
    else
    {
        alert("failed");
    }

    document.getElementById("outar").innerHTML = input;
}

Answer 1

You're trying to do arithmetic with a string. You need to use parseInt() around each of your document.getElementById("....").value expressions because the .value property is a string.

Example:

input += parseInt(document.getElementById("small").value);

Answer 2

Your value is not a number by default, it's a string. You got to parse it first:

input += parseInt(document.getElementById("large").value);