title: Change iFrame Src with Javascript, JQuery, Dynamically
body: <p>I have been trying for the last few hours to change the src of an iFrame. It seems like a simple task but for some reason after hundreds of attempts and reading quite a few other questions and answers on stack, I still find myself without being able to change the src of an iFrame. As you can see from the code below i have attempted this quite a few times. What am I doing wrong?</p>
  
  <pre><code>    &lt;body&gt;
  
         &lt;p&gt;&lt;iframe src="http://localhost/ok.html" name="myFrame" width="500" marginwidth="0"     height="500" marginheight="0" align="middle" scrolling="auto"&gt;&lt;/iframe&gt;
  
  
  &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
      &lt;script&gt;
      function loadPages(){
          var loc = "http://localhost/morningmarketweb/index.html";
  
          //var myIframe = document.getElementById("myFrame");
  
          //window.frames[myIframe].location = "http://localhost/morningmarketweb/index.html";
  
          // $(myIframe).load('http://localhost/morningmarketweb/index.html');
  
          // document.getElementId('myFrame').src="google.com";
  
         // var myIframe = document.getElementById('myFrame');
         // myIframe.src=loc;
  
  
          //$('#myFrame').attr('src', loc);
  
          document.getElementById('myFrame').setAttribute('src', loc);
  
  
      }
      &lt;/script&gt;
      &lt;/body&gt;
  </code></pre>