Hidden form field value not really changed
<p>In the code below, why do I get the new value in the final alert(), but the old value on form submit (and when viewing hidden field with firebug)?</p>

<p>Hidden field element inside form tags:</p>

<pre><code>&lt;input type="hidden" id="shipping_1" name="shipping_1" value="3.99"&gt;
</code></pre>

<p>When ShipTo dropdown is selected, jQuery is used to update the field value:</p>

<pre><code>$('#ShipSelect').change(function(e) {
    var ss = $('#ShipSelect').val();
    if (ss=='International') {
        alert("International orders add $10 S&amp;H");
        ship1 = ($('#shipping_1').val())*1 + 10;
        alert('Shipping_1 val is now: ' + ship1);
        $('#shipping_1').val(ship1);
        alert('Reading the field directly: ' + $('#shipping_1').val());
    }
});
</code></pre>

<p>The alerts show that $10 has been added to the hidden field value. So far so good.</p>

<p>However, when the DOM is viewed with Firebug (or in Chrome DevTools mode) <em>AND/OR</em> when the BuyNow button is pushed, the <code>shipping_1</code> field is at the old value ($10 short).</p>

<hr>

<p>UPDATE:
I saw <a href="http://drupal.org/node/1342858" rel="nofollow">this promising post</a>, which exactly describes my problem, but the solution did not work. This is what they suggested:</p>

<pre><code>document.form_name.field_name.value = your_value
</code></pre>

<p>Therefore, I commented out this line:</p>

<pre><code>$('#shipping_1').val(ship1);
</code></pre>

<p>and replaced it with:</p>

<pre><code>document.paypal_cart.shipping_1.value = ship1;
</code></pre>

<p>The result is no different from what I have now. The old value is still submitted (and visible when viewed with firebug).  DO I need to use .on() somehow to "fix" the changed value to the form or something?</p>
