I'm sure this was covered somewhere, but I can't find it. I'm
struggling with some code and rather than try to explain it, first
look at this code. It should be simple to follow, but when you run it
- it doesn't work as intended.
------------------------------------------------------------------------------------------------------------------------------------------------------------------
<head>
<title>Pop Test</title>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
var i=10;
for (i;i>=1;i--) {
$('#start').after("<div id='" +i+ "' class='popup'>Prior to alert
code (will work) #" +i+ "</div>");
}
$('.popup').click(function(){
alert(this.id);
return false;
});
i=10;
for (i;i>=5;i--) {
$('#'+i).after("<div id='#" +i+ "' class='popup'>Replaced to
alert code (won\'t work) #" +i+ "</div>").remove();
}
});
</script>
<div id="start" class='popup'>Hard code #1</div>
<div id="end" class="popup">Hard code #2</div>
</body></html>
------------------------------------------------------------------------------------------------------------------------------------------------------------------
As you can see, the new text does not fire the click event when
clicked. I'm sure it is because it is located after the popup alert
code.
All that said, how would you generate new text and allow events to be
fired? I'm grabbing text from a database and updating it. I'd like
to have a popup on click.
