Div value not outputting

My assignment is to write a program(s) to figure the future value of an investment. We were given the formula. I have written out all the code and have gone through debugging in the developers console and in the console everything works correctly. But, it is not outputting the answer to the screen. It is probably a terribly simple problem, but I’m not figuring it out. I’m not seeing where my issue/error is. Below is my code. Thank you for helping.

<!Doctype html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<script>

function doFV(){
var p = parseFloat(document.getElementById('amount').value);
var aR = parseFloat(document.getElementById('rate').value);
var y = parseFloat(document.getElementById('amountYears').value);
var pPY = parseFloat(document.getElementById('periods').value);

var value = computeFutureValue(p,aR,y,pPY);

var div = document.getElementById('output');
	div.innerhtml = value;
}

function computeFutureValue(principal, annualRate, years, periodsPerYear){

var n = years * periodsPerYear;
var r = annualRate / periodsPerYear;
var x = 1 + r;

var futureValue = principal * Math.pow(x, n);

return futureValue;


//formula for future value f=a*(1+r)^n, f=future value, a=amount of investment, r=rate per period, n=total # of periods

}

</script>
</head>
<body>
<h1>Investment Calculator</h1>
</br>
</br>
Amount invested (principal)<input type="text" id="amount" align="left"></input>
</br>
Annual rate (example: .08)<input type="text" id="rate" align="left"></input>
</br>
Number of years<input type="text" id="amountYears" align="left"></input>
</br>
Periods per year<input type="text" id="periods" align="right"></input>
</br>
<button type="button" onclick="doFV();">Compute future value</button>
<div id="output"></div>



</body>
</html>

There’s your problem. It’s case-sensitive and should be innerHTML instead.

1 Like

thank you. I should have caught that.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.