How can I add 2 variables that are entered via input text/number type

Question

So I have created 2 text fields via composition ready
$("<input type='text' value='' name='input1' id='input1' size='5'>").appendTo("#Stage");
sym.$("#input1").css({"position":"absolute","top":"70px", "left":"52px"});
$("<input type='text' value='' name='input2' id='input2' size='5'>").appendTo("#Stage");
sym.$("#input2").css({"position":"absolute","top":"90px", "left":"52px"});
input1 AND input2.
The user then puts a number in each field.
I have a 3rd field created to hold the answer. I also made a text field with the name "scorefield" to see if that would work, either will do.
Then on a button on the stage, the user clicks on it to add those first two numbers together and have the sum appear in the 3rd field or the text field that has the symbol name "scorefield".
However I can not seem to be able to add the 2 values of the text fields. On the submit button I have:
var number1 = $("#input1").val();
var number2 = $("#input2").val();
var additionresult = number1 + number2;
sym.$('scorefield').html(additionresult);
answer1.value = additionresult;
The problem is that it is NOT adding number1 and number2 together!
If I substitute + for - or / or * it works using those symbols, but if I try to use the plus sign and add the two, it does not work and instead physically adds the numbers next to eachtoher.
So If I were to put a 5 in field one, and a 2 in field 2, the result comes out to be 52...instead of adding the two values, it places them next to eachother.
I know those ARE numeric values because any other mathamatical sign works. I can multiplay, subtract and divide those two numbers. I can even check to se if its higher or lower of a value using > or <.
But when I use the + sign, it breaks.
Is there some other sign I must use to add two values?

Answer 1

Sorry I forgot to change the string to a integer earlier. Here it is corrected.
file here: https://app.box.com/s/mulkhd1rlyyafovqc3od
var input1 = sym.$("input1")
input1.html("number1: ");
userInput1 = $('<input />').attr({'type':'text', 'value':'', 'id':'input1'});
userInput1 .css ('font-size', 28);
userInput1 .css ('width', 50);
userInput1 .appendTo(input1);
var input2 = sym.$("input2")
input2.html("number2: ");
userInput2 = $('<input />').attr({'type':'text', 'value':'', 'id':'input2'});
userInput2 .css ('font-size', 28);
userInput2 .css ('width', 50);
userInput2 .appendTo(input2);
sym.$('btn').click(function(){
var number1= userInput1.attr('value');
var number2= userInput2.attr('value');
var Numone = parseFloat(number1);
var Numtwo = parseFloat(number2);
var answer = Numone + Numtwo;
sym.$('result').html(answer);