Creating an object array in jQuery

Question

I want to store an array of latitudes/longitudes. I have these inputs on my page:

<input type="hidden" class="latitude" value="-12.3456" />
<input type="hidden" class="longitude" value="12.3456" />
<input type="hidden" class="latitude" value="98.7654" />
<input type="hidden" class="longitude" value="-98.7654" />

And I'm putting them into arrays like so:

var latitudes = $('.latitude').map(function () { return this.value; }).get();
var longitudes = $('.longitude').map(function () { return this.value; }).get();

But I'm thinking that it would be better to store them in a single array as objects, so that I can say:

$.each(array, function (i, obj) {
    alert(obj.Latitude);
    alert(obj.Longitude);
});

How can I modify this to create an array of objects?

Answer 1

I would use jQuery.map():

$.map(latitudes, function(lat, i) {
  return {latitude:lat, longitude:longitudes[i]};
});

Answer 2

var coords = [];
$.each(latitudes, function(index, value) {
    coords.push({'Latitude': value, 'Longitude': longitudes[index]});
});