Javascript is not working in HTML file
<p>I have read through the available links on this topic and they haven't helped. </p>

<p>I'm trying to get the following code to run. The "menu.html" loads the "world.html" in a div on another page, and the HTML comes up, but not the JavaScript.</p>

<p>At first I had the JS in a separate file, but when it wasn't running I moved it into "world.html", but it didn't fix the problem. I have also tried referencing jQuery.</p>

<p>This is menu.html:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;link rel="stylesheet" type="text/css" href="layout.css"&gt;

        &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script src="contact.js"&gt;&lt;/script&gt;
        &lt;script src="preparePage.js"&gt;&lt;/script&gt;
    &lt;/head&gt;

    &lt;body&gt;
        &lt;a id="infoButton" class="infoButton" href="info.html"&gt;&lt;/a&gt;
        &lt;a id="bodyButton" class="bodyButton" href="body.html"&gt;&lt;/a&gt;
        &lt;a id="enterButton" class="enterButton" onclick="preparePage(); return false;"&gt;&lt;/a&gt;
        &lt;a id="leaveButton" class="leaveButton" href="leave.html"&gt;&lt;/a&gt;
        &lt;a id="contactButton" class="contactButton" onclick="contact(); return false;"&gt;&lt;/a&gt;
    &lt;/body&gt;

    &lt;footer&gt;
    &lt;/footer&gt;
&lt;/html&gt;
</code></pre>

<p>And preparePage.js, which gets rid of the menu and loads world.html:</p>

<pre><code>function preparePage() {
    document.getElementById("box").style.backgroundImage = "none";
    $("#infoButton").fadeOut("slow");
    $("#bodyButton").fadeOut("slow");
    $("#leaveButton").fadeOut("slow");
    $("#contactButton").fadeOut("slow");
    $("#box").load("world.html", function enter() {
        $("#enterButton").fadeOut("slow");
    });
}
</code></pre>

<p>And last but not least, world.html:</p>

<pre><code>&lt;!DOCTYPE html&gt;

&lt;html&gt;
    &lt;head&gt;
        &lt;script type="text/javascript"&gt;
        function wut() {
            window.alert("owo");
        }
        &lt;/script&gt;
    &lt;/head&gt;

    &lt;body onload="wut(); return false;"&gt;
        mhfkhgfhtfjhfjj&lt;br&gt;&lt;br&gt;
        &lt;canvas id="gameBox" width="1000" height="500" style="background-color:#ffffff;"&gt;&lt;/canvas&gt;
    &lt;/body&gt;

    &lt;footer&gt;
    &lt;/footer&gt;
&lt;/html&gt;
</code></pre>

<p>EDIT: Also including launchpad.html, which is the page containing the div in which menu.html and world.html load:</p>

<pre><code>&lt;!DOCTYPE html&gt;

&lt;html&gt;
    &lt;head&gt;
        &lt;meta charset="UTF-8"&gt;
        &lt;link rel="stylesheet" type="text/css" href="layout.css"&gt;
        &lt;link rel="stylesheet" type="text/css" href="menu.css"&gt;
    &lt;/head&gt;

    &lt;body onload="openGame(); return false;"&gt;
        &lt;div id="cloud"&gt;&lt;/div&gt;
        &lt;div id="box" class="box"&gt;&lt;/div&gt;

        &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"&gt;&lt;/script&gt;
        &lt;script src="openGame.js"&gt;&lt;/script&gt;
    &lt;/body&gt;

        &lt;footer&gt;
        &lt;/footer&gt;
&lt;/html&gt;
</code></pre>

<p>And openGame.js, which changes the shape of #box and loads menu.html:</p>

<pre><code>    function openGame() {
        $("#cloud").fadeOut("fast");
        $("#box").animate({
            height: '750px',
            width: '1700px',
            top: '100px',
            left: '100px',
            padding: '0px'
        });
        $("#box").load("menu.html");
        document.getElementById("box").style.backgroundImage = "url('Images/menuBackground.png')";
    }
</code></pre>