element fades in/out more than once on mouseover
<p>I am trying to do a simple fade function on mouseover. The problem is that the element fades in and out more than once after the intended item is moused over and then out. I am including my jquery code below along with the accompanying HTML. Any help would be greatly appreciated. Thanks.</p>

<pre><code>$(document).ready(function(){
        $('.claimfile-text').hide();
        $('.claimfile-graphic').mouseover(function(){
            $('.claimfile-text').fadeIn();
        }).mouseout(function(){
            $('.claimfile-text').fadeOut();
        });

    });
</code></pre>

<p>
                (Claim file)<br><br>(hover to reveal)</p>
            </p>

<pre><code>        &lt;div class="claimfile-text fade-box case-text"&gt;
            &lt;p&gt;Claimant&lt;/p&gt;
        &lt;/div&gt;&lt;!-- end claimfile-text --&gt;
</code></pre>
