adding table values in javascript is giving me a result in the table cell of NaN
<p>I am getting a result of NaN in my total table cell value. I am adding two total cells that are being calculated by each time the user enters in the quantity. I am trying to figure out and understand why I am getting this result. This is the code for the function that has the calculation in it. </p>

<pre><code>&lt;html&gt;
&lt;head&gt;
&lt;title&gt; Cart &lt;/title&gt;
&lt;h1&gt; My cart &lt;/h1&gt;
&lt;script type = "text/javascript"&gt;

function retr()
{
    var cke = document.cookie;
    var tot1 = document.getElementById("t1").value;
    var tot2 = document.getElementById("t2").value;

    if (cke.length&gt;0) { 
         start = cke.indexOf("Circle=");
         if (start!= -1) {
             start = start + 7
             end = cke.indexOf("$", start);
             if (end == -1) end = cke.length;
             qu1 = cke.substring(start, end);
             document.getElementById("q1").value = qu1;
        }
    }

    if (cke.length&gt;0) {
        start1 = cke.indexOf("$");
        if (start1!= -1) {
            start1 = start1 + 0
            end = cke.indexOf("e", start1);
            if (end == -1) end = cke.length;
            pr1 = cke.substring(start1, end);
            document.getElementById("p1").value = pr1;

        }
    }

    document.getElementById("t1").value = parseFloat(qu1) * parseFloat(pr1);

    if (cke.length&gt;0) {
        start = cke.indexOf("Stickman=");
        if (start!= -1) {
            start = start + 9
            end = cke.indexOf("$", start);
            if (end == -1) end = cke.length;
            qu2 = cke.substring(start, end);
            document.getElementById("q2").value = qu2;
        }
    }

    if (cke.length&gt;0) {
        start = cke.indexOf("$");
        if (start!= -1) {
            start = start + 54
            end = cke.indexOf("e", start);
            if (end == -1) end = cke.length;
            pr2 = cke.substring(start, end);
            document.getElementById("p2").value = pr2;
        }
    }

    alert(qu1);
    alert(pr1);
    alert(qu2);
    alert(pr2);
    alert(t2);
    document.getElementById("t2").value = parseFloat(qu2) * parseFloat(pr2);
    document.getElementById("tot").value = parseFloat(tot1) + parseFloat(tot2);
    document.getElementById("ret").value = cke;
}


&lt;/script&gt;
&lt;/head&gt;

&lt;body onload = "retr()"&gt;
&lt;table border = "1"&gt;
    &lt;td&gt;Circle &lt;/td&gt;
    &lt;td&gt;&lt;input type = "text" size = "8" id = "q1" readonly = "readonly" /&gt;&lt;/td&gt; 
    &lt;td&gt; &lt;input type = "text" size = "8" id = "p1" readonly = "readonly" /&gt; &lt;/td&gt;
    &lt;td&gt; &lt;input type = "text" size = "8" id ="t1"&gt;  &lt;/td&gt;
    &lt;tr&gt; &lt;/tr&gt;
    &lt;td&gt; Stickman &lt;/td&gt;
    &lt;td&gt; &lt;input type = "text" size = "8" id = "q2" readonly = "readonly" /&gt;&lt;/td&gt;
    &lt;td&gt; &lt;input type = "text" size = "8" id = "p2" readonly = "readonly" /&gt; &lt;/td&gt;
    &lt;td&gt; &lt;input type = "text" size = "8" id = "t2" &gt;  &lt;/td&gt;
    &lt;tr&gt; &lt;/tr&gt;
    &lt;td colspan = "3"&gt;  TOTAL:&lt;/td&gt;
    &lt;td&gt; &lt;input type = "text" size = "8" id = "tot"&gt;  &lt;/td&gt;
&lt;/table&gt; 
&lt;br /&gt; &lt;br /&gt;
&lt;input type ="text" id = "ret" readonly = "readonly" /&gt;
&lt;br / &gt; &lt;br /&gt;
&lt;input type = "button" value = "Checkout"&gt;
&lt;br /&gt; &lt;br /&gt;
&lt;a href = "store.html" &gt; Continue Shopping &lt;/a&gt;


&lt;/body&gt;
&lt;/html&gt;
</code></pre>
