title: Plot multiple markers on leaflet and attach a click event to each marker which redirects to a new page along with the clicked marker information
body: <p>I am developing a mobile application using jQuery mobile and leaflet.
  I am using ajax to fetch marker data from the server and plotting the markers on the map dynamically. I am using a $.each loop to loop through each object returned as Json from the server and to generate markers.
  I am appending anchor element within each marker Popup.  When the user click on the anchor element the current page will be redirected to a new page and information like lat, lon, stName and state will be passed to the next page using query string.</p>
  
  <p>The code works fine it redirects the user to the new page with all the information, but the mobile browser takes a long time performing the redirect operation.
  When I tried redirecting to a new page without the query string the redirect operation was quick.</p>
  
  <p>Is there an efficient way to perform this redirect operation with the information on the current page?
  Does anyone know why there is a time delay when the page redirect using query string?
  Is there an bindClick event in leaflet?</p>
  
  <p>The structure of meta_data is as below:</p>
  
  <pre><code>meta_data=[{elev:50, ll:[-90,29], name:"Baton Rouge"}, sids:[123,456,789], state:"LA"}, ...]
  
      $.each(meta_data, function(ind, meta_obj){
          marker=L.marker([meta_obj.ll[1], meta_obj.ll[0]]);
          click_element='&lt;a href ="http://storm.srcc.lsu.edu/mobile/climatedata.html?stId='+meta_obj.sids[0]+"&amp;"+"lat="+meta_obj.ll[1]+"&amp;"+"lon="+meta_obj.ll[0]+"&amp;stName="+meta_obj.name+"&amp;state="+meta_obj.state+'"&gt;Click Here For More Data&lt;/a&gt;';
          marker.bindPopup("&lt;b&gt;Station Name: &lt;/b&gt;"+meta_obj.name+"&lt;br /&gt;"+"&lt;b&gt;Station Id: &lt;/b&gt;"+meta_obj.sids[0]+"&lt;br /&gt;"+click_element);
          marker.addTo(map);
  });
  </code></pre>