title: Uncaught reference error: $ is not defined error
body: <p>I took this code from a tutorial to make an auto advancing slideshow in javascript/jQuery and it works wonderfully in jsfiddle. However, when I bring everything over into Dreamweaver it seems to just stop working. Everything is there, I've linked all the relevant files (the .js and the .css) as well as the jQuery library. For some reason though it won't work at all. Here's the code.</p>
  
  <p>The HTML</p>
  
  <pre><code>&lt;div class="fadeIn"&gt;
              &lt;img src="image1.png" height="500" width="800"/&gt;
              &lt;img src="image2.png" height="500" width="800"/&gt;
              &lt;img src="image3.png" height="500" width="800"/&gt;
              &lt;img src="image4.png" height="500" width="800"/&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>The CSS</p>
  
  <pre><code>.fadeIn {
      position: relative;
      width: 800px;
      height: 500px;
  }
  
  .fadeIn img {
      position: absolute;
      left:0;
      top:0;
  }
  </code></pre>
  
  <p>The Javascript/jQuery</p>
  
  <pre><code>$(function(){
      $('.fadeIn img:gt(0)').hide();
      setInterval(function(){
      $('.fadeIn :first-child').fadeOut()
          .next('img').fadeIn()
          .end().appendTo('.fadeIn');
      }, 3000);
  });
  </code></pre>
  
  <p>Here's the header</p>
  
  <pre><code>&lt;script src="SlideShow.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="jquery-1.7.2.min.js" type="text/javascript"&gt;&lt;/script&gt;
  
  &lt;link rel="stylesheet" type="text/css" href="SlideShow.css"&gt;
  </code></pre>