how to make jquery event in the popup work?
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js"></script>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" />
</head>
<body>
<div id="map" style="width:500px;height:500px;">
<script>
var map = L.map('map').setView([54.6154, 18.8141], 7);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors,<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>'
}).addTo(map);
L.marker([54.6154,18.8141]).addTo(map).bindPopup("<a href='#' class='A1'>link</a>");
</script>
</div>
<a href='#' class='A1'>link</a>
<script>
$( '.A1' ).click(function() {
alert('halo');
});
</script>
</body>
</html>