Home/ Questions/Q 8835731
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T09:19:34+00:00

I’m trying to load from initial.html different html page with: $(#hidden_demo_div).load(modules/another.html, function (data) {

  • 0

I’m trying to load from initial.html different html page with:

$("#hidden_demo_div").load("modules/another.html", function (data) {
    var value = $(data).filter("#demo_div");
    var html = value.html(); // THERE IS NO <strong>Hello</strong> here!!!
}

here a snippet from another.html

<html>
    .........................
    <head>
    <script type="text/javascript">
        $(document).ready(function() {
             anotherMethodInvocation();
        });
    </script>
    </head>

    <div id="demo_div"></div>
</html>

next at JS for another.html I have:

function anotherMethodInvocation() {    
    $("#demo_div").append("<strong>Hello</strong>");
}

So the question is why am I getting (in my callback function at load) just static HTML but not it changes?

UPDATE 1:

a) The “#hidden_demo_div” is at the initial.html (HTML where JS code with .load is linked).
This element is declared at the BODY :

b) It DOES NOT work even if I put at the BODY
(to one html file)

<div id="hidden_demo_div"></div>

and
(to another html file)

<div id="demo_div"></div>

at the BODY.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    It’s important to realize that when loading a remote page the ready event has already occured in the main page. This means that code wrapped in $(document).ready(function() {} in the remote page will fire instantly.

    If the code in the remote file precedes the html it refers to it will not find that html as it doesn’t exist at the time the code fires.

    Try this structure in the remote page:

    <div id="demo_div"></div>
<!--  "demo_div" now exists , can run code on it -->
<script type="text/javascript">            
       anotherMethodInvocation();

</script>
    • 0