title: Javascript function apparently not firing
body: <p>I have an <code>&lt;iframe&gt;</code> control on my page and I want to change it's target url (the url of the page displayed in the iframe) by a click on a hyperlink. The problem is that the iframe doesn't update on the click. I'm pretty sure I'm missing something, but I don't know what:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  var source = document.getElementById("CurrentlySelected")
  function change(u) {
      if (source.getAttribute("src") != u) {
          source.setAttribute("src", u);
          document.location.reload(true);
      }
  }
  &lt;/script&gt;
  
  &lt;ul&gt;
      &lt;li&gt;&lt;a href="#" onclick="change('http://www.somewebsite.com');"&gt;Website 1&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#" onclick="change('http://www.thiswebsite.net');"&gt;Website 2&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;iframe id="CurrentlySelected" width="800px" height="600px" src="http://www.somewebsite.com"&gt;&lt;/iframe&gt;
  </code></pre>
  
  <p>JS is not my forte, but I don't see a problem here... any ideas?</p>
  
  <p>Another problem is that the background of the iframe isn't taking the same color of the website linked in its src attribute...</p>
  
  <p><strong>EDIT</strong><br>
  The issue with the background color of the website in the iframe seems to be an issue with Google Chrome, anyone know about a fix?</p>