title: How to add and remove items with JQuery from an array stored in a hidden field
body: <p>I cant seem to do this in an elegant way, and I don't understand some of the behaviour I'm seeing.</p>
  
  <p>I have my array stored in html like so:<br>
  <code>&lt;input type="hidden" id="myField" value="1,2,3,5,8,13"&gt;</code></p>
  
  <p>To add a value I must do this, is this really the cleanest way to do this?  </p>
  
  <pre><code>$('#myField').val($('#myField').val() + ',' + 21);
  </code></pre>
  
  <p>And to remove I value I have to do something like this:    </p>
  
  <pre><code>newValues=$.grep($('#myField').val(), function(value) {  
          return value != 3;  
       });  
        $('#myField').val(newValues);
  </code></pre>
  
  <p>Apart from this does not work.....as I get the same behaviour as illustrated here:</p>
  
  <p>If i do this:  </p>
  
  <pre><code>$.grep('1,2,3',function(value){return value!=3;})
  </code></pre>
  
  <p>It returns this, why do I get these extra blank elements? How do I remove 3 from the hidden input?:</p>
  
  <pre><code>["1", ",", "2", ","]
  </code></pre>