jQuery loaded within a Javascript ( js ) file
<p>This is a very simple script that should load jQuery. I can see in the Firebug Scripts tab that jquery is loading but I get '$ is not defined" errors when I try to use it. Can anyone help me understand what's wrong?</p>

<pre><code>//function to add scripts
function include(file)
{
    var script  = document.createElement('script');
    script.src  = file;
    script.type = 'text/javascript';
    script.defer = true;     
    document.getElementsByTagName('head').item(0).appendChild(script);
}
//add jQuery
include('https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js');

//See if jQuery is working
$(document).ready(function() {
    $('#internal').show();
})

////////////
//RETURNS: "$ is not defined $(document).ready(function() {"
</code></pre>

<p>The odd thing is if don't try to use jQuery in this same script instead I load another js file that uses jQuery it does work</p>

<pre><code>//function to add scripts
function include(file)
{
    var script  = document.createElement('script');
    script.src  = file;
    script.type = 'text/javascript';
    script.defer = true;     
    document.getElementsByTagName('head').item(0).appendChild(script);
}
//add jQuery
include('https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js');

//add my custom script that wants to use jQuery
include('scripts/testScript.js')
</code></pre>

<p>testScript.js</p>

<pre><code>$(document).ready(function() {
    $('#external').show();
})
</code></pre>

<p>I appreciate any advice with this.</p>
