I'm having a really hard time with this JavaScript project for my computer science college class. I am making a website as a project. On the website, I am selling soda. The problem I am having is I cannot figure out how to correctly create the "total" equation. Here is the link to the webpage.

http://uni.edu/fagleb/cs1000/sodashop.html

As you can tell, when you click the buttons, then click total, the total is at $0.00. If anyone can help me with this it would be great!



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.ord/1999/xhtml">
<head>
<meta html-equiv="Content-Type" content="text/html;"
charset=utf-8"/>
<title>The Soda Shop</title></head>
<style type="text/css">
body {background-color : black;
color : darkorange;
font-family : helvetica; text-align: center}
table {margin-left : auto; margin-right : auto; text-align : center;
background-color : #993300; border-style : solid;
border-color : firebrick;
border-width : medium;
padding : 8 px}


</style>
</head>
<body>
<script type = "text/javascript">
var quanity =1;
var flavor ="none";
var ounce =0;
</script>
<h1 style="color : white"> The Soda Shop</h1>
<hr style="width : 50%; color : darkorange"/>
<p><b>figuring the price of sodas<br />
because you know you want one</b></p>
<form action="">

<table>
<tr>
<td>
<input type="button" value="1" onclick='quanity = 1'/>
</td>
<td>
<input type="button" value="SMALL" onclick='ounce = 12'/>
</td>
<td>
<input type="button" value=" COKE "
onclick='flavor = "coke"'/>
</td>
<td>
<input type="button" value="Clear" onclick=
'quanity = 1;
flavor = "none"
ounce = 0;
document.forms[0].price.value = "0.00"
'/>
</td>
</tr>
<tr>
<td>
<input type="button" value="2" onclick='quanity = 2'/>
</td>
<td>
<input type="button" value="MEDIUM" onclick='ounce = 20'/>
</td>
<td>
<input type="button" value=" PEPSI "
onclick='flavor = "pepsi"'/>
</td>
<td>
</td>
</tr>
<tr>
<td>
<input type="button" value="3" onclick='quanity = 3'/>

</td>
<td>
<input type="button" value="LARGE" onclick='ounce = 32'/>
</td>
<td>
<input type="button" value=" MOUNTAIN DEW "
onclick='flavor = "mountain dew"'/>
</td>
<td>
<input type="button" value="Total" onclick=
'var price;
var taxRate = 0.088;
if (flavor == "coke") {
if (ounce == 12)
price = 1;
if (ounce == 20)
price = 1.85;
if (ounce == 32)
price = 2.50;
if (flavor == "pepsi" || flavor == "mountian dew") {
if (ounce == 12)
price = .85;
if (ounce == 20)
price = 1.50;
if (ounce == 32)
price = 2.25;
}
if (flavor == "Dr. Pepper") {
if (ounce == 12)
price = .75;
if (ounce == 20)
price = 1.25;
if (ounce == 32)
price = 2;
}
price = price + (quanity) * 1.07;
price = price + price * taxRate;
document.forms[0].price.value=price;
'/>
</td>
</tr>
<tr>
<td>
<input type="button" value="4" onclick='quanity = 4'/>
</td>
<td>
</td>
<td>
<input type="button" value=" DR. PEPPER "
onclick='flavor = "drpepper"'/>
<td style="border-style : solid; border-width : medium;
border-color : red">
<input type="text" name="price" value="0.00" size="5"
onchange=''/>
</table>
</form>
</body>
</html>