<!DOCTYPE html>
<html>

  <head>
    <link href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" rel="stylesheet" />
    <link href="style.css" rel="stylesheet" />
    <script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
  </head>

  <body>
    <h3>Click on map to add some markers</h3>
    <div id="map"></div>
    <button id="openPopup">Open random popUp</button>
    <script src="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet-src.js"></script>
    <script src="script.js"></script>
  </body>

</html>

var map = L.map('map', {}).setView([49, 16], 10);

L.tileLayer('http://tile.openstreetmap.org/{z}/{x}/{y}.png', {
  maxZoom: 16,
  atribution: 'Map data &copy; OSM.org'
}).addTo(map);

var markers = [];

map.on('click', function(event) {
  var marker = L.marker(event.latlng);
  marker.bindPopup('Opened popUp!');
  marker.off('click');
  marker.on('click', function() {return;});
  marker.addTo(map);
  markers.push(marker);
});

function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

jQuery('#openPopup').click(function(){
  if (markers.length) {
    markers[getRandomInt(0, markers.length - 1)].openPopup();
  }
});

#map{
  height: 400px
}

Basic example of Leaflet map with bouncing markers.