title: jQuery dynamically updating hidden input value based on quantity
body: <p>I have written some jQuery code to dynamically update a hidden input value based on the quantity that the user chooses:</p>
  
  <pre><code>$('input[name^="quant"]').change(function () {
         updateTotal();
      });
  
  function updateTotal() {
          var count = 1;
          $('input[name^="quant"]').each(function() {
              var qty = $(this).val();
              var price = $(this).siblings('input[name^="price"]').val();
              $('input[name=item_name_'  + count + ']').val(qty + ' x ' + $('input[name=item_name_'  + count + ']').val());
  
              count++;
          });
      }
  </code></pre>
  
  <p>The line <code>$('input[name=item_name_'  + count + ']').val(qty + ' x ' + $('input[name=item_name_'  + count + ']').val());</code> replaces the entire input by appending the value of the current input value on the end.</p>
  
  <p>For example if the quantity is 4 then the element will look like this: </p>
  
  <pre><code>&lt;input type="hidden" name="item_name_1" value="4 x Front Row Seats"&gt;
  </code></pre>
  
  <p>The problem I am having is as this is happening on change, it will do this every time i change the quantity:</p>
  
  <pre><code>&lt;input type="hidden" name="item_name_1" value="5 x 4 x Front Row Seats"&gt;
  &lt;input type="hidden" name="item_name_1" value="3 x 5 x 4 x Front Row Seats"&gt;
  &lt;input type="hidden" name="item_name_1" value="4 x 3 x 5 x 4 x Front Row Seats"&gt;
  </code></pre>
  
  <p>and so on...</p>
  
  <p>Is there a way I can save the value on the hidden input before I do this so it never appends like this?</p>