JavaScript error msg : Uncaught TypeError: Cannot set property 'onclick' of null

The below javascript code is displaying nothing,although this code works by Fiddle perfectly. The javascript console gives me 2 error messages which I don't understand: Failed to load resource: net::ERR_FILE_NOT_FOUND and Uncaught TypeError: Cannot set property 'onclick' of null, so anyone understands the reason of the error messages and how can I get my code worked so it will calculate & display stuff that users will choose?

The code is:

var numericalValues = new Array();
numericalValues["Alot"]= 4;
numericalValues["NotMuch"]= 2;
numericalValues["NoSometimes"]= 3;
numericalValues["Hate"]= 0;
numericalValues["Chocolate"]= 4;
numericalValues["Carrot"]= 0;
numericalValues["Both"]= 2;
numericalValues["None"]= 0;


function getScoreChoco()
{
var scoreChoco = 0;
var form = document.forms["form"];
var choco = form.elements["choco"];
for(var i=0; i<choco.length; i++)
{
    if(choco[i].checked)
    {
    scoreChoco = numericalValues[choco[i].value];
    break;
    }

}
return scoreChoco;
}

function getScoreCake()
{
var scoreCake = 0;
var form = document.forms["form"];
var cake = form.elements["cake"];

for(var i=0; i<cake.length; i++)
{
  if(cake[i].checked)
  {
  scoreCake = numericalValues[cake[i].value];
  break;
  }

}
return scoreCake;
}


function getTotal()
{

var totalScore = getScoreCake() + getScoreChoco();


document.getElementById('result').innerHTML = "Your total score is: "+totalScore;



document.getElementById('calculate').onclick=getTotal;
}

Okay the HTML code for it:

<form id="form" name="form">
<fieldset id="controls">
<p>Do you like chocolate?
<label>Yes a lot </label>
<input type="radio" name="choco" id="alot" value="Alot" checked="true">

<label>Not that much </label>
<input type="radio" name="choco" id="notMuch" value="NotMuch">
<label>No, but still I don't mind eating it sometimes </label>
<input type="radio" name="choco" id="noSometimes" value="NoSometimes">

 <label>No, I hate it </label>
<input type="radio" name="choco" id="hate" value="Hate">
</p>
<p>Do you prefer chocolate cake or carrot cake?
<label>chocolate </label>
<input type="radio" name="cake" id="chocolate" value="Chocolate" checked="true">

<label>Carrot </label>
<input type="radio" name="cake" id="carrot" value="Carrot">

<label>Both</label>
<input type="radio" name="cake" id="both" value="Both">

<label>None </label>
<input type="radio" name="cake" id="none" value="None">
</p>

<p>
  <input type="button" name="Calculate" id="calculate" value="Calculate" />
</p>
    <p id="result"></p>

    </form>