Bootstrap Carousel Indicators Not Working
<p>When clicking on the indicator circles in this carousel, rather than loading the appropriate image, nothing happens. The carousel does cycle through each image; there is simply no way to control it with the indicators. I've read a previously posted thread about this issue, and the solutions proposed there have not worked for me. Would anybody mind taking a quick look at my html to see if I'm missing something painfully obvious? Thank you in advance for taking the time!</p>

<p><div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;head&gt;
    &lt;title&gt;Freshwater Ranch&lt;/title&gt;
    &lt;link rel="shortcut icon" href="logo.jpg" type="image/ico"&gt;
    &lt;meta charset = "UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
    &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"&gt;
    &lt;link href='https://fonts.googleapis.com/css?family=Homemade+Apple' rel='stylesheet' type='text/css'&gt;
    &lt;link href='https://fonts.googleapis.com/css?family=Lato:700' rel='stylesheet' type='text/css'&gt;
    &lt;link rel="stylesheet" type="text/css" href="freshwater_styles.css"&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"&gt;  &lt;/script&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;‌
    &lt;script src="jquery-1.12.0.min.js"&gt;&lt;/script&gt;
    &lt;script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"&gt;&lt;/script&gt;
&lt;/head&gt;



&lt;div class="photo_body" class="carousel slide" data-ride="carousel" id="rotating_photos"&gt;
     &lt;ol class="carousel-indicators"&gt;
      &lt;li data-target="#rotating_photos" data-slide-to="0" class="active"&gt;&lt;/li&gt;
      &lt;li data-target="#rotating_photos" data-slide-to="1"&gt;&lt;/li&gt;
      &lt;li data-target="#rotating_photos" data-slide-to="2"&gt;&lt;/li&gt;
      &lt;li data-target="#rotating_photos" data-slide-to="3"&gt;&lt;/li&gt;
     &lt;/ol&gt;
     &lt;div class="carousel-inner"&gt;
      &lt;div class="item active"&gt;
       &lt;img src="ranchhouseview1.jpg" alt="View of Ranch"&gt;
      &lt;/div&gt;
      &lt;div class="item"&gt;
       &lt;img src="view4.jpg" alt="View of Ranch"&gt;
      &lt;/div&gt;
      &lt;div class="item"&gt;
       &lt;img src="horse.jpg" alt="Horse Photo"&gt;
      &lt;/div&gt;
      &lt;div class="item"&gt;
       &lt;img src="view5.jpg" alt="View of Ranch"&gt;
      &lt;/div&gt;
     &lt;/div&gt;&lt;!--carousel inner--&gt;

    &lt;/div&gt;&lt;!--carousel outer--&gt;</code></pre>
</div>
</div>
</p>