title: Mayhem: onMouseOver onMouseOut with div
body: <p>Imagine moving your mouse left to right across this webpage fragment:</p>
  
  <p><img src="https://i.stack.imgur.com/1Rn7p.gif" alt="enter image description here"></p>
  
  <p>The gray box is a DIV. I want a <strong>single</strong> onMouseOver when mousing into it, and a <strong>single</strong> onMouseOut when exiting it.</p>
  
  <p>What I actually get (left to right):</p>
  
  <pre><code>onMouseOver DIV
  onMouseOut DIV
  onMouseOver Flag
  onMouseOut Flag
  onMouseOver DIV
  onMouseOut DIV
  onMouseOver USA
  onMouseOut USA
  onMouseOver DIV
  onMouseOut DIV
  onMouseOver 2
  onMouseOut 2
  onMouseOver DIV
  onMouseOut DIV
  </code></pre>
  
  <p>Whew!</p>
  
  <p>How can I just get a single onMouseOver and onMouseOut for the container DIV?</p>