I have some simple code:
$(document).ready(
function() {
$('.A1').click(
function() {
$('#Info').load('Test_A1.htm');
}
);
$('.A2').click(
function() {
$('#Info').load('Test_A2.htm');
}
);
}
);
followed in the body with:
<body>
<div class="A1">A1</div>
<div class="A2">A2</div>
<div id="Info" style="border:1px solid red;"></div>
</body>
Test_A1.htm is simply the following:
<div>This is A1</div>
<div class="A2">Click this text to display Test_A2.htm</div>
Test_A2.htm is the same as Test_A1.htm, only with the "1" and "2"
values switched.
When I click on A1 or A2, the text from the associated files is loaded
into #Info, so that works fine. However, when I click on the A1 or A2
class within #Info, nothing happens.
I guess I am missing something fundamental here, so it would be very
helpful if someone could explain how I can get the text that is
displayed within #Info "clickable" so that it can load the other file.
Thanks for your help.
george
