Here's a JSFiddle.
If you want to store the object in an input field, you can use JSON.stringify():
 //Pass your array (or JSON object) into JSON.stringify:
 JSON.stringify([{id:1, product_id: 2, name: 'stack'},
                 {id: 2, product_id: 2, name: 'overflow'}] )
which will yield:
 "[{"id":1,"product_id":2,"name":"stack"},{"id":2,"product_id":2,"name":"overflow"}]"
You can store this value in a hidden field (or a data attribute):
 <input type="hidden" id="project" value="[{'id':1,'product_id':2,'name':'stack"',{'id':2,'product_id':2,'name':'overflow'}]" />
Obviously, you can combine these steps (or do it through PHP / Rails / ...)
 $('#project').val(JSON.stringify([1,2,3]));
You can then decode this using, for instance, jQuery:
 $.parseJSON($('#project').val());
This should allow you to use the process you are using, but store Javascript objects in your input fields.  Hope this helps!