title: document.createElement fails for new window
body: <p>I have two HTML files, FirstWindow and SecondWindow. FirstWindow has FirstWindowJS.js as its script and SecondWindow has SecondWindowJS.js as its script.</p>
  
  <p>Through FirstWindowJS.js, I open SecondWindow.html. However, I am unable to create an element for it. Here's the code along with the problem - </p>
  
  <p>FirstWindow.html</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
  &lt;title&gt;FirstWindow&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;script type="text/javascript" src="FirstWindowJS.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>SecondWindow.html</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;
  &lt;title&gt;SecondWindow&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;script type="text/javascript" src="SecondWindowJS.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>FirstWindowJS.js</p>
  
  <pre><code>main();
  
  function main()
  {
      var myWindow = window.open("SecondWindow.html", "My Window", 
      "resizable=0,width=700,height=600");
  
      var e = myWindow.document.createElement("currentUserElement");
      e.setAttribute("id", "currentUserElement");
      e.setAttribute("value","John");
  }
  </code></pre>
  
  <p>SecondWindowJS.js</p>
  
  <pre><code>main();
  
  function main()
  {
       var e = document.getElementById("currentUserElement"); 
       var value = e.getAttribute("value");
       console.log("value = "+value);
  }
  </code></pre>
  
  <p>The error that I get in the SecondWindowJS.js is - </p>
  
  <pre><code>TypeError: e is null 
  </code></pre>
  
  <p>Why is "e" null? What is the mistake?</p>