title: Creating paragraphs based on user input
body: <p>I'm having trouble, grabbing the user input, and having the onclick operator create additional paragraphs with each click.</p>
  
  <p>Here is my HTML code.</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
  
      &lt;html lang='en'&gt;
      &lt;head&gt;
      &lt;title&gt;Add Paragraph &lt;/title&gt;
      &lt;meta charset='utf-8' &gt;
      &lt;script src="../js/addPara.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;/head&gt;  
      &lt;body&gt;
      &lt;div&gt;
      &lt;input type='text' id='userParagraph' size='20'&gt;
      &lt;/div&gt;
  
      &lt;div id="par"&gt;
  
      &lt;button id='heading'&gt; Add your paragraph&lt;/button&gt; 
      &lt;/div&gt;
      &lt;/body&gt;
      &lt;/html&gt;
  
  Here is Javascript code: 
  
  window.onload = function() {
    document.getElementById("addheading").onclick = pCreate;
  };
  
      function pCreate() {
        var userPar= document.createElement("p");
        var parNew = document.getElementById('userParagraph').value;
        userPar.innerHTML = par;
        var area = document.getElementById("par");
        area.appendChild(userPar);
  }
  </code></pre>