[jQuery] append and selector problem;
Hi,
I am facing one problem In jquery. For easy understanding, below html
code created.
Before clicking on CHANGE label if click on 12345, I am getting
hiiiiiii alert message.
After clicking on CHANGE I am not getting alert message.(I am
experting hiiiiii should come on click of 67890 also).
code sample
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$('#change').click(function(){
$('#div1').empty();
$('#div1').append('<table><thead><th>NEW TEST</th></
thead><tbody><tr><td>67890</td></tr><tr><td>EFGHI</td></tr></tbody>');
});
$("tbody tr").click(function(){
alert("hiiiiiiiiii");
});
});
</script>
</head>
<body>
<div id="div1">
<label id="change">CHANGE</label>
<table>
<thead>
<th>
TEST
</th>
</thead>
<tbody>
<tr>
<td>12345</td>
</tr>
<tr>
<td>ABCD</td>
</tr>
</tbody>
</div>
</body>
</html>
1) Please explain why this is not behaving as experted.
2) In case of NOTE (see at last) change, why it is working?
3) how can I slow this issue
NOTE:- If i change like below it is working.
$(document).ready(function(){
$('#change').click(function(){
$('#div1').empty();
$('#div1').append('<table><thead><th>NEW TEST</th></
thead><tbody><tr><td>67890</td></tr><tr><td>EFGHI</td></tr></tbody>');
$("tbody tr").click(function(){
alert("hiiiiiiiiii");
});
});
});