title: load mp4 video by query string
body: <p>I need to load a mp4 video by a query string. Using jquery my code does not update the video source. If I place the example video url in the html5 source id it works without the JQuery. My task is to open the page with the correct video loaded.</p>
  
  <p>Problem was code didn't see JS source.. Also defined variable with $ when I shouldn't have. Now it works..</p>
  
  <pre><code>  &lt;video id='videoPlayer' width="640" height="480" controls="controls"&gt;
        &lt;source id='mp4Source' src="" type="video/mp4" /&gt;  
      &lt;/video&gt;  
      &lt;script src="jquery.min.js"&gt;&lt;/script&gt;
  &lt;!--&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;--&gt;
    &lt;script&gt;
  
  $(document).ready(function () {
      // theVid will be populated by query string, for testing it's hard coded.
      //var theVid = 'http://html5demos.com/assets/dizzy.mp4';
      var theVid = 'http://techslides.com/demos/sample-videos/small.mp4';
  
      var player = document.getElementById('videoPlayer');
      var mp4Vid = document.getElementById('mp4Source');
  
      player.pause();
  
        // Now simply set the 'src' attribute of the mp4Vid variable!!!!
        // (...using the jQuery library in this case)
  
      $(mp4Vid).attr('src', theVid);
      player.load();
      //player.show();
      player.play();   
  
  });
  </code></pre>