jquery - Javascript/Navbar Dropdown Not Working With Twitter Bootstrap -

i'm trying use latest version of twitter bootstrap create navigation menu dropdown links.

however, dropdown doesn't work, , collapsed navbar doesn't go up.

i'm assuming in javascript doesn't work, i've double checked hotlinks , they're , working.

here's have in head:

    <!-- le javascript -->  <!-- google libraries charts , jquery --> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>  <!-- latest compiled , minified javascript bootstrap--> <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>  <!-- sharethis javascript --> <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type="text/javascript">stlight.options({publisher: "be79498d-c866-4538-945f-677020fd645d", donothash: false, donotcopy: false, hashaddressbar: false});</script>  <!-- pesonal javascript files --> <script src="../js/interactions.js"></script> <script src="../js/data-model.js"></script> <script src="../js/charts.js"></script>  <!-- le css -->  <!-- latest compiled , minified css bootstrap --> <link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.4/yeti/bootstrap.min.css" rel="stylesheet">  <!-- personal style sheet --> <link rel="stylesheet" href="../css/calculator.css"> 

i don't see issues this.

here's html nav. copied , pasted bootstrap source docs.

<nav class="navbar navbar-inverse">       <div class="container-fluid">         <!-- brand , toggle grouped better mobile display -->         <div class="navbar-header">           <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">             <span class="sr-only">toggle navigation</span>             <span class="icon-bar"></span>             <span class="icon-bar"></span>             <span class="icon-bar"></span>           </button>           <a class="navbar-brand" href="http://www.healthkismet.com">health kismet</a>         </div>      <!-- collect nav links, forms, , other content toggling -->             <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">               <ul class="nav navbar-nav">                 <li class="active"><a href="http://www.healthkismet.com/formula-analyzer/">formula analyzer <span class="sr-only">(current)</span></a></li>                 <li><a href="http://www.healthkismet.com/formula-analyzer/how-to-use/">how use</a></li>                 <li><a href="#">suppliers</a></li>                 <li class="dropdown">                   <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">help <span class="caret"></span></a>                   <ul class="dropdown-menu" role="menu">                     <li><a href="#">contact/faq</a></li>                     <li><a href="http://forums.healthkismet.com">forums</a></li>                   </ul>                 </li>                 <li><a href="http://blog.healthkismet.com/starting-supplement-business">get formula</a></li>                 <li class="dropdown">                   <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">blog <span class="caret"></span></a>                   <ul class="dropdown-menu" role="menu">                     <li><a href="http://blog.healthkismet.com">company blog</a></li>                     <li><a href="http://blog.healthkismet.com/topics/entrepreneurship">entrepreneurship articles</a></li>                   </ul>                 </li>               </ul>             </div><!-- /.navbar-collapse -->         </div><!-- /.container-fluid -->     </nav> 

not sure if it's wrong bootstrap or if there's possible interference other javascript files.

you can view whole page here: www.healthkismet.com/formula-analyzer/

you have many of same js scripts , new , old versions.

please put of these js scripts below @ end of page.

<!-- le javascript -->  <!-- google libraries charts , jquery --> <script type="text/javascript" src="https://www.google.com/jsapi"></script>   <!-- le javascript -->  <!-- google libraries charts , jquery --> <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>  <!-- latest compiled , minified javascript bootstrap--> <script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js">   </script>  <!-- sharethis javascript --> <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type="text/javascript">stlight.options({publisher: "be79498d-c866-4538-945f-677020fd645d", donothash: false, donotcopy: false, hashaddressbar: false});</script>  <!-- pesonal javascript files --> <script src="../js/interactions.js"></script> <script src="../js/data-model.js"></script> <script src="../js/charts.js"></script> 

and use 1 css cdn link. when using bootstrap , custom css, placement of css can take priority on in order read in page.

it works if use js scripts above.