title: Insert textbox and drop-down menu
body: <p>I want to keep the title and the genre of a movie for a further use. I'm trying to display the textbox and the dropdown menu only when I click the sentence 'insert a movie'.The dropdown menu appears before I click the sentence and I dont know how to change that.I also want somehow to keep the input values.</p>
  
  <pre><code>    &lt;html&gt;
      &lt;head&gt;
      &lt;title &gt;MOVIES &lt;/title&gt; 
  
      &lt;script type="text/javascript"&gt;
      function myFunction() {
      document.getElementById("a").innerHTML="&lt;p&gt;&lt;input type='text' name='title'&gt;";
      }
      &lt;/script&gt;
  
      &lt;/head&gt;
      &lt;body&gt;
      &lt;center&gt;
      &lt;form&gt;
      &lt;h1 style="color:black"&gt;MOVIES &lt;/h1&gt;
      &lt;/center&gt;
      &lt;ul&gt; 
      &lt;li&gt; &lt;a  onclick="myFunction()"&gt;Insert a movie &lt;/a&gt;    &lt;/li&gt;
      &lt;p id="a"&gt;&lt;/p&gt;
  
  
  
      &lt;select name="mydropdown"&gt;
      &lt;option value="Action"&gt;Action&lt;/option&gt;
      &lt;option value="Animation"&gt;Animation&lt;/option&gt;
      &lt;option value="Comedy"&gt;Comedy&lt;/option&gt;
      &lt;option value="Drama"&gt;Drama&lt;/option&gt;
      &lt;option value="Fantasy"&gt;Fantasy&lt;/option&gt;
      &lt;option value="Horror"&gt;Horror&lt;/option&gt;
      &lt;option value="Mystery"&gt;Mystery&lt;/option&gt;
      &lt;option value="Romance"&gt;Romance&lt;/option&gt;
      &lt;option value="Sci-fi"&gt;Sci-fi&lt;/option&gt;
      &lt;option value="War"&gt;War&lt;/option&gt; 
  
      &lt;/form&gt;
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>