moving jquery function to external js file

Question

I have a jquery function that works great hard coded onto the html page right above the head tag

<script type="text/javascript" src="js/jquery.js"></script>    
<script>
$(document).ready(function() {
$('#side-menu').sidr();
});
</script>
</head>

however when i move this to the external .js file that is also right above the head tag, it doesn't work. I'm formatting it on the external.js file like this:

$(document).ready(function() {
$('#side-menu').sidr();
});

and including my external.js file on the html like this:

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/external.js"></script>
</head>

is there some syntax i'm missing?

yup, doing that. just edited my question to reflect that. any other reasons it might not be working? thanks guys! — midknyte
– midknyte, Commented Feb 15, 2015 at 0:05
yup, no typos, but it's definitely not loading. when hard coded it adds a class to the #side-menu div, but when extrnal and i check the source that class hasn't been added. i see this answer here: stackoverflow.com/questions/17600264/… but i'm not sure what i'm supposed to wrap the function in. his example is a bit different than mine and i'm not advanced enough to know how to modify it. thanks again for any help. — midknyte
– midknyte, Commented Feb 15, 2015 at 0:34

Brett · Accepted Answer · 2015-02-15 08:59:03Z

3

Without seeing your page I don't know how you are laying it all out, but since it works inline but not externally you could make sure you put:

<script type="text/javascript" src="js/external.js"></script>

...in the same place as you had:

$(document).ready(function() {
$('#side-menu').sidr();
});

answered Feb 15, 2015 at 8:59

Brett

20.3k58 gold badges169 silver badges306 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

midknyte Over a year ago

That was it! i had the order mixed up with other scripts, that's why it wasn't running. can't believe i didn't notice that. thanks.

Gero · Accepted Answer · 2016-04-11 23:52:58Z

0

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script src="js/app.js"></script>
</head>

The jquery src should be always above those external .js files that use jquery.

answered Apr 11, 2016 at 23:52

Gero

13.6k29 gold badges71 silver badges112 bronze badges

Collectives™ on Stack Overflow

moving jquery function to external js file

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related