Add multiple marker on mapbox

referring to a codepen demo at <a href="https://codepen.io/Maximusssssu/pen/zYpZYZX?editors=1111"></a>. As you can see when you click on map, it will place a marker, may I know how to add multiple markers so that the previous marker that I have added does not go away? I would prefer the coordinates(latitide,longitude) to be stored in an array. Please show a demo for understanding :)

function add_marker (event) {
  var coordinates = event.lngLat;
  console.log('Lng:', coordinates.lng, 'Lat:', coordinates.lat);
  marker.setLngLat(coordinates).addTo(map);
}

map.on('click', add_marker);