[jQuery] checking created items again via DOM
You will need to assign the click to the newly created DOM elements.
The elements MUST be attached to DOM before you can assign an event
otherwise, the event will not be bound.
I think this achieves what you want in jQuery plugin format ;)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Recursive Event Assignment</title>
<style type="text/css">
.lin {
cursor:pointer;
}
</style>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$.fn.createLink = function() {
this.click(function() {
var text = "Child of "+$(this).text();
var newLink = $("<span class='lin'>"+text+"</span><br/>");
$("#sublevels").append(newLink);
newLink.createLink(); // can only bind events AFTER an element is
attached to the DOM
});
};
$().ready(function () {
$(".lin").createLink();
});
</script>
</head>
<body>
<h1>Main Links</h1>
<ul>
<li class="lin">Link 1</li>
<li class="lin">Link 2</li>
<li class="lin">Link 3</li>
</ul>
<h1>Sublevels</h1>
<div id="sublevels">
</div>
</body>
</html>