javascript - How to add input data into hidden input field -

i have input field user enter desired input , data copied hidden input field problem occurs when new data replace old data

this copy data

$('#ap').val(json.stringify(data)); 

this input field

<input type="hidden" name="apcount" id="ap" value=""> 

now if add data 'hello' added hidden input value looks

<input type="hidden" name="apcount" id="ap" value="hello">  

now if again enter 'how you' replaces old data new..

i want keep both data

1 - [{"ratio":"1","size":"s","quantity":"83"},{"ratio":"2","size":"m","quantity":"166"}]  2 - [{"ratio":"3","size":"m","quantity":"93"},{"ratio":"2","size":"m","quantity":"136"}] 

these above json data should numbered stored in hidden value

here running code

$('body').on('click', '.export-btn', function() {   var $rows = $table.find('tr:not(:hidden)');   var headers = [];   var data = [];    // headers (add special header logic here)   $($rows.shift()).find('th:not(:empty)').each(function () {     headers.push($(this).text().tolowercase());   });    // turn existing rows loopable array   $rows.each(function () {     var $td = $(this).find('td');     var h = {};      // use headers earlier name our hash keys     headers.foreach(function (header, i) {       h[header] = $td.eq(i).text();        });      data.push(h);   });    // output result   $('#ap').val(json.stringify(data)); }); 

html code  <input id="getval" value="" /> <button id="addbtn">add</button>  // jquery code      var arraydata = [];     $("#addbtn").on("click", function() {         var currentdata = $("#getval").val();         arraydata.push({             "count": arraydata.length + 1,             "data": currentdata         });         console.log(arraydata);     }); 

you updated jason every time in arraydata in json format. hope got desired output.