title: How do I clear inner HTML
body: <p>I've been fiddling with this for a while but it won't work and I can't figure out why. Please help. Here is what I have:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;title&gt;lala&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;h1 onmouseover="go('The dog is in its shed')" onmouseout="clear()"&gt;lalala&lt;/h1&gt;
      &lt;div id="goy"&gt;&lt;/div&gt;
      &lt;script type="text/javascript"&gt;
      function go(what) {
          document.getElementById("goy").innerHTML = what;
      }
      function clear() {
          document.getElementById("goy").innerHTML = "";
      }
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The mouseover works and displays the text in the div, but when I move the mouse out of the h1 tag, the text stays there and I don't know why, help would be appreciated.</p>