Why is the same Popup text displayed for both Markers OpenLayers

I am displaying two Marker dynamically on OSM 5. The data saved to the array is (longiutde, latitude, car name) The Marker are being correctly displayed with a Popup window for each one. The Popup windows should contain the name of each car, but the problem here is that i am ALWAYS getting the second name of the car displayed on both Popups which is wrong. I am really stucked i have tried everything i knew.

/ open street map newest version / var map = new ol.Map({ target: 'map', // the div id layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({ center: ol.proj.fromLonLat([4.35247, 52.520008]), zoom: 6, minZoom: 3 }) }); for(var i=0; i < arrayPos.length; i++) { var long = arrayPos[i][0] var lat = arrayPos[i][1]; var vehName = arrayPos[i][2]; // add a marker to the map var layer = new ol.layer.Vector({ source: new ol.source.Vector({ features: [ new ol.Feature({ geometry: new ol.geom.Point(ol.proj.fromLonLat([long, lat])) })] }) }); layer.setStyle(new ol.style.Style({ image: new ol.style.Icon({ src: 'https://wiki.openstreetmap.org/w/images/0/0c/Hgv.png', // scale: 0.4 // set the size of the vehicle on the map }) })); map.addLayer(layer); //initialize the popup var container = document.getElementById('popup'); var content = document.getElementById('popup-content'); var overlay = new ol.Overlay({ element: container, autoPan: true, autoPanAnimation: { duration: 250 } }); map.addOverlay(overlay); console.log(vehName); // two different car names are shown in the console //display the pop with on mouse over event map.on('pointermove', function (event) {
if (map.hasFeatureAtPixel(event.pixel) === true) {
var coordinate = event.coordinate; //simple text written in the popup, values are just of the second index content.innerHTML = 'Im a vehicle:
'+vehName; //just the second one is getting displayed overlay.setPosition(coordinate); } else { overlay.setPosition(undefined); } }); } Any help is really appreciated!!