Error making element change value using onClick event.

Posted 22 February 2013 - 03:10 PM

Hi I have just started getting back into coding after like a year and I decided to start out by trying to make a program to calculate energy out of a given amount of mass (Einsteins e=mc^2) to get the gears rolling. Well I am having a problem. I started out by writing functions to convert different types of units to each other and the main calculation to energy. So far I'm only testing convertMassToEnergy() and massEnergyConverter() since they are the main functions. Well my problem is if I change the value of my input from 0 to something else, the answer won't change. I tried using Chromes Javascript error console and my original problem was have math.pow() instead of Math.pow() which I fixed. Now according to the error console there is no errors, yet it's still not working. Could somebody help me figure this out because I'm going to obsess over it till it gets fixed, thanks in advance for help.

Javascript:

var speedOfLight = 299792458;

function convertMassToKilograms(unit, value) { // unit = 0 is kilograms
	var mass = value;
	if (unit == 1) { // ounces
	mass = value * 16 * 0.453592;
	}
	if (unit == 2) { // pounds
	mass = value * 0.453592;
	}
	if (unit == 3) { // grams
	mass = value * 1000;
	}
	return mass;
}

function convertJoulesToOther(unit, value) { // unit = 0 is joules
	var energy = value;
	if (unit == 1) { // calories
	energy = value * 0.239005736;
	}
	return energy;
}

function convertMassToEnergy(mass) { // kilograms
	if (mass < 0) {
	window.alert("Mass cannot be less than zero.");
	return null; }
	else {
	var energy = mass * Math.pow(speedOfLight, 2);
	return energy; // Joules
	}
}

function massEnergyConverter() {
	var massInput = document.getElementById("mass");
	var massValue = parseFloat(massInput.value);
	var displayAnswer = document.getElementById("displayAnswer");
	// check for units
	var energy = convertMassToEnergy(massValue);
	displayAnswer.innerHtml = energy;
}

HTML:

<form action="">
			<label>Mass:
				<input type="text" id="mass" value="0" /></label>
			<input type="button" value="Convert" onclick="massEnergyConverter()" />
		</form><br />
		<div><span id="displayAnswer">0</span>&nbsp;<span>joules.</span></div>