Autofill Amount
<p>I have this split function which I can add more fields by clicking the button. My Problem are if I add a field I can't get the exact amount and back the amount if I remove the field.</p>

<p><strong>Sample Scenario:</strong></p>

<p><img src="http://i.stack.imgur.com/eyz8k.png" alt="enter image description here"></p>

<p>The above image show the initial amount <strong>-1,000.50</strong>. Now these are my problems.</p>

<p><img src="http://i.stack.imgur.com/Wb6OP.png" alt="enter image description here"></p>

<ol>
<li><p>I input <code>50</code> in the amount of first field which result to <code>Payee: 1 [-950.50]</code> as the remaining amount for payee. When I add another field it's auto fill the amount and I expect <code>-950.50</code> because that's the remaining amount. But what I get is the initial amount <code>-1,000.50</code> in the second field. <strong>How to get the updated remaining amount?</strong></p></li>
<li><p>If I remove the added field I want to added back the amount. For ex. if the field has <code>50</code> and the remaining amount is <code>-950.50</code>. If I remove the field that contains amount of  <code>50</code> it must be added back in the remaining amount and it will be <code>-1,000.50</code>. <strong>How to added back the amount?</strong></p></li>
</ol>

<p>Here are what I have tried:</p>

<p><strong>split.html</strong></p>

<pre><code>&lt;table id="dataTable" class="calendar fluid" data-calendar-options='{"maxHeight":70}'"
    &lt;caption&gt; Payee: 1 
        [&lt;span id="remaining"&gt;-1,000.50&lt;/span&gt;]
    &lt;/caption&gt;

    &lt;tbody&gt;
        &lt;tr&gt;
            &lt;td class="week-end" id="p_scents"&gt;&lt;br/&gt;
                *Note: Amount totals must equal transaction total and envelopes must be specified to 
                       enable the split button.&lt;br/&gt;&lt;br/&gt;

                &lt;p class="button-height"&gt;
                    &lt;span class="input"&gt;
                        &lt;label class="button orange-gradient"&gt;Envelope #1&lt;/label&gt;

                        &lt;select name="env[]" class="envelope select compact"&gt;
                            &lt;option value="none"&gt;(Select)&lt;/option&gt;

                            &lt;optgroup label="Category"&gt;
                                &lt;option value="1"&gt;Internet&lt;/option&gt;
                                &lt;option value="2"&gt;Savings&lt;/option&gt;
                            &lt;/optgroup&gt;
                        &lt;/select&gt;

                        &lt;input type="text" name="amt[]" placeholder="0.00" size="10" 
                            id="validation-required" class="input-unstyled input-sep validate[required]"
                            onkeyup="calculate(0)"&gt;

                        &lt;input type="text" name="note[]" placeholder="note" class="input-unstyled" id="note"&gt;
                    &lt;/span&gt;

                    &lt;span class="with-tooltip"&gt;
                        &lt;img src="{{STATIC_URL}}img/icons/tick.png" title="Default"&gt;
                    &lt;/span&gt;
                &lt;/p&gt;&lt;br/&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tbody&gt;

    &lt;tfoot&gt;
        &lt;tr&gt;
            &lt;td&gt;
                &lt;a href="javascript:{}" id="addScnt" class="button orange-gradient icon-plus-round"&gt;
                    Another Envelope
                &lt;/a&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
    &lt;/tfoot&gt;
&lt;/table&gt;


&lt;script&gt;
    function calculate(difference) {
        var sum = 0;
        $(":text").each(function() {
            amt = replaceCommaDollar(this.value);
            if(!isNaN(amt) &amp;&amp; amt.length!=0) {
                sum += parseFloat(amt);
                total = sum;
                difference = -1,000.50 + total                                  
            }
        });

        $("#remaining").html(numberWithCommas(difference.toFixed(2)));

        if(difference == 0){
            $("#split").html("&lt;button type='submit' class='button orange-gradient'&gt;Split Amount&lt;/button&gt;");
        }else{
            $("#split").html("&lt;button type='submit' class='button orange-gradient' disabled='disabled'&gt;Split Amount&lt;/button&gt;");
        }
    }

    $(function() {
        var scntDiv = $('#p_scents');
        var i = $('#p_scents p').size() + 1;
        var remain_amount = Math.abs(replaceCommaDollar($("#remaining").text())).toFixed(2);

        $('#addScnt').live('click', function() {  
            $('&lt;p class="button-height"&gt;'+
              ' &lt;span class="input"&gt;'+
              '     &lt;label class="button orange-gradient"&gt;' + 'Envelope #' + i + '&lt;/label&gt;' +
              '     &lt;select name="env[]" class="envelope select compact"&gt;'+
              '         &lt;option value="none" selected="selected"&gt;(Select)&lt;/option&gt;' +
              '         &lt;optgroup label="Category"&gt;' +
              '             &lt;option value="1"&gt;Internet&lt;/option&gt;' +
              '             &lt;option value="2"&gt;Savings&lt;/option&gt;' +
              '         &lt;/optgroup&gt;' +
              '     &lt;/select&gt;' +
              '    &lt;input type="text" name="amt[]" id="split-amount' + i + '" placeholder="0.00" size="10" class="input-unstyled input-sep" onkeyup="calculate(0)" value="'+ remain_amount +'"&gt;'+
              '    &lt;input type="text" name="note[]" placeholder="note" class="input-unstyled"&gt;'+
              ' &lt;/span&gt;'+
              ' &lt;a href="javascript:{}" id="remScnt" class="with-tooltip"&gt;Remove&lt;/a&gt;&lt;/p&gt;&lt;br/\&gt;'
              ).appendTo(scntDiv);

             $("#remaining").html('0.00');
             $("#split").html("&lt;button type='submit' class='button orange-gradient'&gt;Split Amount&lt;/button&gt;");

             i++;
             return false;
        });

        $('#remScnt').live('click', function() {
            if( i &gt; 2 ) {
                test = $('#split-amount'+i).val();
                alert(test);

                $(this).parents('p').remove();

                i--;
            }

            return false;
        });
    });
&lt;/script&gt;
</code></pre>
