Home/ Questions/Q 9195097
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T21:33:30+00:00

Page 1 <html> <head> <script src=jquery-1.8.3.js type=text/javascript></script> </head></head> <body><div id=main></div> </body> <script>$(‘div[id=main]’).load(‘page2.php’) $(‘span[id*=temp]’).on(‘click’,function(){ alert(this.id);

  • 0

Page 1

<html>
<head>
<script src="jquery-1.8.3.js" type="text/javascript"></script>
</head></head>
<body><div id="main"></div> </body>
<script>$('div[id=main]').load('page2.php')
$('span[id*=temp]').on('click',function(){
alert(this.id); }); //this block of code not working!!
</script>
</html>

Page 2

<div>
<span id="temp">
this is demo
</span>
</div>

Basically i want to load page2 again in main div when tag is clicked but am not able to fetch the id of the tag in page one,script of page1 not working for page 2 items or tags

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You are trying to bind the event right after the AJAX call, so the element doesn’t exist yet. The call is asynchronous, so it doesn’t stop the code execution to wait for the response.

    Either bind the element after the content has loaded, using the success callback of the load method:

    $('div#main').load('page2.php', function(){
  $('span[id*=temp]').on('click', function(){
    alert(this.id);
  });
});

    or use a delegate to bind the event to the parent element:

    $('div#main').load('page2.php');
$('div#main').on('click', 'span[id*=temp]', function(){
  alert(this.id);
});
    • 0