Javascript getting the values of an array of input boxes

Question

I have an input field that has a button to dynamically add another input field and I am trying to get it so that when I click plot i am able to grab the content inside the input fields gps[]

html

<div id="marker">
 <input type="text" name="gps[]" id="gps">
 <input type="text" name="gps[]">
</div>

Plot

javascript

var counter = 1;
var limit = 3;
function addInput(divName){
 if (counter == limit) {
 alert("You have reached the limit of adding " + counter + " inputs");
 }
 else {
 var newdiv = document.createElement('div');
 newdiv.innerHTML = "<input type='text' name='gps[]'>";
 document.getElementById(divName).appendChild(newdiv);
 counter++;
 }
}
$('body').on('click','.plot', function(){
 var y = $('input[name="gps[]"]').val();
 console.log(y);
});

Answer 1

You have to use .map to get the value of all the elements in the collection :

var y = $('input[name="gps[]"]').map(function() {return this.value;}).get();

FIDDLE