title: What is proper method of appending multiple lines of HTML using JavaScript?
body: <p>I'm aware of <code>appendChild</code> and <code>createElement</code> but these are methods to use when I'm adding a single line of HTML. I recognize I could add a script object, or an <code>iframe</code> object using this approach, but how would I in JavaScript add 20+ lines of HTML to an existing HTML document?</p>
  
  <p>I built a <code>search.js</code> file to address searching requirements of an HTML page. It works great! But I want to encapsulate my search form and CSS and was thinking I could append the data to an existing HTML document to keep things compact and more manageable. </p>
  
  <p>UPDATE: So the JavaScript would be added to an existing HTML page at the bottom within two SCRIPT tags. The JS would append a string - which would be 20+ lines of HTML stringified - to an existing page, which I had hoped would render as HTML.</p>
  
  <pre><code>var sectionAsHtml = '' +
  '&lt;div class='xyz'&gt;' +
  ' &lt;div class='abc'&gt;' +
  '  &lt;p&gt;This is just an example for demonstration purposes.&lt;/p&gt;' +
  ' &lt;/div&gt;' +
  '&lt;/div&gt;';
  </code></pre>
  
  <p>I would then locate the body of my HTML using a ".getElementById" find, and then ".appendChild" the above string.</p>