content being replaced on hover, but existing text not being removed
<p>Sorry if this question is explained a bit poorly JQuery is not my "native" language, so I'll try to explain as best I can.  (and I've set up a jsfiddle to help show the code) <a href="http://jsfiddle.net/6eYYR/" rel="nofollow">http://jsfiddle.net/6eYYR/</a></p>

<p>I have a webpage here: <a href="http://www.waranuwater.com.au/pages/test-1" rel="nofollow">http://www.waranuwater.com.au/pages/test-1</a> I had a colleague assist me, in getting to the point I am now with the Jquery.</p>

<p>Scroll down to the second area, I have two divs set up side-by-side, one on the left contains an imagemap, the other on the right a "content area" with html content. The "content area" contains some text that will change when the user hovers over a part of the imagemap. </p>

<p>I've managed to get the content (which I have made black to make it easier to see for the timebeing) to change when the relevant part of the imagemap is hovered ,  when the user hovers over the imagemap, but I can't work out how to have the initial content disappear when the hover occurs (the bit that starts with "Complete Contaminant Removal") </p>

<p>This is my current Jquery code: </p>

<pre><code> function showHideDivs(indx){
            hideDivs();
            oShowHideDivs[indx].style.display = 'block';
        }
        function hideDivs(){
            for(i=0; i &lt; oShowHideDivs.length; i++){
                oShowHideDivs[i].style.display = 'none';
            }
        }
        window.onload=function(){
            oShowHideDivs =  
document.getElementById('ccontainer').getElementsByTagName('div');
            var oMap = document.getElementById('myMap');
            for(i=0; i &lt; oMap.areas.length; i++){
                oMap.areas[i].indx = i;
                oMap.areas[i].onmouseover=function(){showHideDivs(this.indx);}
                oMap.areas[i].onmouseout = hideDivs;
            }
        }
</code></pre>

<p>Am I missing something here?  Do I need to tell Jquery to "hide" the existing text?, and if so how would I go about doing that?</p>

<p>Thanks in advance</p>
