<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="utf-8">
<title>Custom Plunker</title>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/redmond/jquery-ui.css">
<link rel="stylesheet" type="text/css" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css">
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.js"></script>
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.js"></script>
<script type="text/javascript" src="app.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<br />
<br />
<br />
<a href="#" data-box="myAlert">Hint</div>
<div id="myAlert" class="alert alert-info hide">
<p>Alert Me !!!!</p>
</div>
</body>
</html>
$(function(){
$('[data-box]').click(function(){
var $this = $(this);
$('#' + $this.data('box')).toggle()
return false;
});
});