title: Owl Carousel Will Not Autoplay
body: <p>I'm building a wordpress site with a JQuery carousel using the <a href="http://www.owlcarousel.owlgraphic.com/" rel="nofollow noreferrer">Owl Carousel 2</a> JQuery plugin. I've used this carousel before with success, but I'm stumped on this one and I need your help. I'm hoping others who may run into the same issue can reference this solution you all help with. </p>
  
  <p>The carousel will load, images are displaying, and most options that I've tried are working, but autoplay will not load the next image after 5 seconds. All files are in their proper place and loading correctly, as verified using the Firebug network inspector. <strong>Thank you for your help/suggestions in advance!</strong></p>
  
  <p>customjs.js:</p>
  
  <pre><code>    $(document).ready(function(){
          var owl = $(".owl-carousel");
          owl.owlCarousel({
              items: 1,
              autoplay: true,
              autoplayTimeout: 5000,
              autoplayHoverPause: true
          });
      });
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;head&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;     
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"&gt;&lt;/script&gt;
  &lt;script src="owl/js/owl.carousel.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="customjs.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;    
  &lt;div id="feature" class="full"&gt;
  &lt;!-- FEATURE ROTATOR --&gt;
  &lt;div id="home-feature" class="owl-carousel owl-theme"&gt;
        &lt;div class="item"&gt; 
          &lt;a href="#"&gt;
              &lt;img src="/images/home/rotator1.jpg"
                    alt="Feature 1"/&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt; 
          &lt;a href="#"&gt;
              &lt;img src="/images/home/rotator2.jpg"
                    alt="Feature 2"/&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt; 
          &lt;a href="#"&gt;
              &lt;img src="/images/home/rotator3.jpg"
                    alt="Feature 3"/&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt; 
          &lt;a href="#"&gt;
              &lt;img src="/images/home/rotator4.jpg"
                    alt="Feature 4"/&gt;
          &lt;/a&gt;
        &lt;/div&gt;                
  &lt;/div&gt;
  &lt;/div&gt; 
  &lt;/body&gt;
  </code></pre>
  
  <p>I have also tried appending <code>owl.trigger('owl.play',6000);</code> within the document.ready function per a suggestion on <a href="https://stackoverflow.com/questions/22678720/owl-carousel-wont-autoplay">this stackoverflow thread</a> to no avail.</p>