jQuery is not defined twitter bootstrap

Question

I am getting this error that says jQuery is not defined. I want to use twitter bootstrap and jQuery-UI. In my I\'ve added the CSS and JS necessary.

Answer 1

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

add jquery js file above bootstrap

Answer 2

This is most likely because of 2 reasons:

1. You are loading jQuery twice; remove one of them (preferably the older version).
2. You are loading bootstrap.min.js before loading jQuery (read the documentation here).

What you need to do is:

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" />
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js" />
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" />

Answer 3

Load jQuery before everything else!

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

Answer 4

I've tested this and this order seems to work the best.

1. Load CSS
2. Load jQuery
3. Load Bootstrap
4. Load jQuery UI