<html>
<head>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(function(){
// add row button
$('.append_button').click(function(){
var row = $('<div class="lister">'+new Date()+' <input type="button" class="row_button" value="click me!" /></div>');
row.appendTo('.container');
});
// delegate for append button
$('.container').delegate('.lister input:button', 'click', function(){
alert('delegate ok!');
});
// delegate for append button (falied, because .lister was not found on delegate action)
$('.container .lister').delegate('input:button', 'click', function(){
alert('delegate, again!');
});
});
</script>
</head>
<body>
<div class="container">
<input type="button" class="append_button" value="Add" />
</div>
</body>
</html>
Posts
