title: how to display function calculation in html using button with eventhandler
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//area = 1/2 b * h
  
  var btn = document.getElementById("btn");
  btn.addEventListener('click', findArea);
  
  function findArea(base, height) {
    var base = document.getElementById("base").value;
    var height = document.getElementById("height").value;
  
    var area = base * height / 2;
    var result = document.getElementById('result');
    return result.textContent = area;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form&gt;
    &lt;input type="number" id="base"&gt;
    &lt;p&gt;Enter base measurement&lt;/p&gt;
    &lt;input type="number" id="height"&gt;
    &lt;p&gt;Enter height measurement&lt;/p&gt;
    &lt;button id='btn'&gt;Click to find the area of your triangle.&lt;/button&gt;
  &lt;/form&gt;
  &lt;p id="result"&gt;&lt;/p&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Can someone tell me why the result of the returned calculation flashes and then disappears from the screen? I would like it to remain there until another set of numbers are input for a new round-thank you…</p>