Why isn't my script files included when i load external content into a #content div with ajax load();

I'm trying to figure out why my JS files (script files) aren't loading when i load external content into my DIV with the id of content. I get the HTML and CSS but somehow the scripts doesn't load.

My index page (with head, body etc.. including scripts and css links) is showing on page load (inside #content DIV).
What am i doing wrong here? What would be the easiest way to include my script files on all my external pages which loads into my #content div?

Sample code to get a better picture of the problem situation:

    <a href="Link1">Link1</a>
    <a href="Link2">Link2</a>

    <nav>
        <div class="name">Erik</div>

        <a class="btn btn-1 btn-1a about" href="about" id="aboutbtn">About me</a>
    </nav> 

            <div id="content">

            </div>

Video link that explains what i've done so far (NOT MY VIDEO), without the explanation of how to include my script files: https://www.youtube.com/watch?v=ytKc0QsVRY4

If there are any questions just ask, and i will try to make it more clear!

Thanks beforehand! /// E

Solution

Whatever your using is phasing out the scripts, which is all good, because scripts have to work with the document as a whole not when it's fragmented.

You could load the scripts after the elements/HTML/CSS are appended to the document. I looked at your video and fair enough Jquery has a special method to load scripts and have them added to the program stack.

jQuery.getScript()

Check documentation:

https://api.jquery.com/jquery.getscript/

Throw that code into a separate .js file and load it in.

EDIT

Better yet use .appendTo() in your case:

http://jsfiddle.net/LeroyRon/bk9fryuj/