title: Javascript hide/show - more elegant way to do this?
body: <p>I'm looking for a more elegant way to make a hide/show of divs using inline Javascript.</p>
  <p>If you mouse over the orangish/yellow circle logos over the cars the tag should appear. When moused out they should disappear.</p>
  <p>URL:</p>
  <p><a href="http://174.120.239.48/%7Epeakperf/" rel="nofollow noreferrer">http://174.120.239.48/~peakperf/</a></p>
  <pre><code>&lt;div class=&quot;second&quot;&gt;
      &lt;div id=&quot;speech2&quot; style=&quot;display: none&quot;&gt;
          &lt;img src=&quot;&lt;?php bloginfo('template_url'); ?&gt;/images/speech2.png&quot; width=&quot;334&quot; height=&quot;50&quot;&gt;
          &lt;/div&gt;
      &lt;a id=&quot;various2&quot; href=&quot;#inline2,javascript:HideContent('speech1')&quot; title=&quot;&quot; onmouseover=&quot;HideContent('speech1'); return true;&quot;&gt;
          &lt;img src=&quot;&lt;?php bloginfo('template_url'); ?&gt;/images/clicker.png&quot; width=&quot;62&quot; height=&quot;50&quot; onmouseover=&quot;document.getElementById('speech2').style.display = 'block'&quot; onmouseout=&quot;document.getElementById('speech2').style.display = 'none'&quot;&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  <p>Here's the pastebin of the code used:</p>
  <p><a href="http://pastebin.com/JsW6eJRZ" rel="nofollow noreferrer">http://pastebin.com/JsW6eJRZ</a></p>