title: Conflict between jquery and bootstrap
body: <p>I have a code where I am including jquery files and bootstrap files in the header.php. I am running into issues where if I include the jquery file before bootstrap.js file, it messes up the other tabs on my webpage and basically even if i click on the other tabs it does not navigate me. </p>
  
  <p>I think there is a conflict between jquery and bootstrap. I am pasting my header.php file below for more reference. </p>
  
  <p>header.php</p>
  
  <pre><code>&lt;?php require_once "essentials.php";
  //error_reporting(~0);
  //ini_set('display_errors', 1);
  ?&gt;
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
  &lt;!--&lt;style&gt;{height:150px; width:1300px;}&lt;/style&gt;--&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
  &lt;META HTTP-EQUIV="CACHE-CONTROL" CONTENT="Public"&gt;
  &lt;title&gt;&lt;?php echo $page_title?&gt;&lt;/title&gt;
  &lt;script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="js/bootstrap.js"&gt;&lt;/script&gt;
  &lt;script src="script_dbafactory.js?&lt;?php echo rand(0,511);?&gt;"&gt;&lt;/script&gt;
  &lt;link href="css/bootstrap.css" rel="stylesheet"&gt;
  &lt;!--&lt;link href="css/style_header.css" rel="stylesheet"&gt;--&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div class="container"&gt;
          &lt;div class="row clearfix"&gt;
                  &lt;div class="col-md-4 column"&gt;
                          &lt;img alt="logo" src="./images/source.png"&gt;
                  &lt;/div&gt;
                  &lt;div class="col-md-8 column dbf"&gt;
                          &lt;h2&gt;
                                  DBA Factory
                          &lt;/h2&gt;
                  &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="row clearfix"&gt;
                  &lt;div class="col-md-12 column"&gt;
                          &lt;div class="tabbable" id="tabs-775712"&gt;
                                  &lt;ul class="nav nav-tabs"&gt;
                                           &lt;li&gt;
                                                  &lt;a href="../dbafactory/home_page.php?sub=1" data-toggle="tab"&gt;Home&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;
                                                  &lt;a href="../dbafactory/form_page.php?sub=2" data-toggle="tab"&gt;Submit a project&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;
                                                  &lt;a href="../dbafactory/view_table.php?sub=3" data-toggle="tab"&gt;All Projects&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;
                                                  &lt;a href="#panel-4" data-toggle="tab"&gt;Innovative Ideas&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;
                                                  &lt;a href="#panel-5" data-toggle="tab"&gt;Matchmaker&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;
            &lt;a href="#panel-6" data-toggle="tab"&gt;Meet the Team&lt;/a&gt;
                                          &lt;/li&gt;
  
                                          &lt;div class="dropdown"&gt;
                                          &lt;?php include "userlogin.php"; ?&gt;
                                          &lt;/div&gt;
                                  &lt;/ul&gt;
  
                          &lt;/div&gt;
                  &lt;/div&gt;
          &lt;/div&gt;
  
  
  &lt;/div&gt;
  &lt;/body&gt;
  
  &lt;!--&lt;script type="text/javascript"&gt;
  //Script to implement tabs 
  $('#myTab a').click(function (e) {
    e.preventDefault()
    $(this).tab('show')
  })
  
  &lt;/script&gt;--&gt;
  &lt;script&gt;
  $.noConflict();
  $(document).ready(function (){
          $('.dropdown-toggle').dropdown();
          $('#userlogin').dropdown('toggle');
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Can someone please let me know how do i solve this issue? and how should i load all the js and css files to avoid any issues with the webpage. </p>
  
  <p>Thanks</p>