title: Javascript function working in JSFiddle, but not on my local copy
body: <p>I'm trying to make a simple fadeout effect with Javascript.</p>
  
  <p>It wasn't working when I tried it in my text editor + Google Chrome, so I copied it into JSFiddle and it worked!</p>
  
  <p><a href="http://jsfiddle.net/yLFFt/" rel="nofollow">http://jsfiddle.net/yLFFt/</a></p>
  
  <p>However, I can't figure out what is correct in JSFiddle that is not correct in my original copy.</p>
  
  <p>I'll post the code as I have it in Notepad++:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt; 
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;My Site&lt;/title&gt;
          &lt;link rel="stylesheet" type="text/css" href="style2.css"&gt;
          &lt;/style&gt;
          &lt;script&gt;
            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  
            ga('create', 'UA-08000000-1', 'mysite.com');
            ga('send', 'pageview');
  
          &lt;/script&gt;
          &lt;script type="text/javascript" src="js/jquery_1.4.2.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript" src="js/flashing_logos.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="background_logo"&gt;
              &lt;img src="http://drivesmartbc.ca/sites/default/files/images/smiley%20face.thumbnail.jpg"&gt;
          &lt;/div&gt;
          &lt;div id="logo"&gt;
              &lt;img src="https://lh4.googleusercontent.com/-b86bjfIcDMk/TXpUmwBK_FI/AAAAAAAAARY/ws-ypr2P39I/s200/9+smiley+face.jpg"&gt;
          &lt;/div&gt;
          &lt;div id="signup"&gt;
              &lt;p id="instruction"&gt; Get on board! &lt;/br&gt; Enter your email to receive updates:&lt;/p&gt;
              &lt;script type="text/javascript" src="js/form-validation.js"&gt;&lt;/script&gt;
              &lt;form id="emailForm" action='#' method="post"&gt;
                  &lt;input name="email"  id="email" type="text" /&gt;
                  &lt;input type="button" value="Submit" name="submit" id="submit" /&gt;
              &lt;/form&gt;
              &lt;p id="success" class="success"&gt;Thanks - we'll keep in touch!&lt;/p&gt;
              &lt;p id="error" class="warning"&gt;There was an error&lt;/p&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  
  
  &lt;/html&gt;
  </code></pre>
  
  <p>and my Javascript looks like this:</p>
  
  <pre><code>function fade(element) {
      var op = 1;  // initial opacity
      var timer = setInterval(function () {
          if (op &lt;= 0.1){
              clearInterval(timer);
              element.style.display = 'none';
          }
          element.style.opacity = op;
          element.style.filter = 'alpha(opacity=' + op * 100 + ")";
          op -= op * 0.1;
      }, 50);
  }
  fade(document.getElementById('background_logo'));
  </code></pre>