title: JavaScript array content in html without .innerHTML
body: <p>I am new to JavaScript and web development. I am trying to display contents of a few JavaScript arrays in html. From what I have read, using <code>.innerHTML</code> destroys all child elements. </p>
  
  <p>I have 2 javascript arrays that I am querying from a REST API:</p>
  
  <pre><code>var humid=[10, 20, 30, 40];
  var temp=[50, 60, 70, 80];
  </code></pre>
  
  <p>How do I display text in html that says, on each line:</p>
  
  <p>Temperature was <strong>10</strong> degrees and humidity was <strong>50</strong>%</p>
  
  <p>Temperature was <strong>20</strong> degrees and humidity was <strong>60</strong>%</p>
  
  <p>... and so on.</p>
  
  <p>Should I still use <code>.innerHTML</code>? If so, wouldn't it destroy all but the last line of the output? The output is being added to a <code>&lt;div&gt;</code> element, without a list or table.</p>