I may get killed for this but I have been trying for a few days using Prototype to show a hidden div when hovering over another div. I have this working fine in jquery but I could use some help porting it over to prototype.

The code sample:

<script type="text/javascript">
$(document).ready(function(){
  $(".recent-question").hover(function(){
   $(this).find(".interact").fadeIn(2.0);
  }, function(){
   $(this).find(".interact").fadeOut(2.0);
  });    
});
</script>

<div class="recent-question"> 
<img src="images/new/img-sample.gif" alt="" width="70" height="60" />
                        <div class="question-text">
                            <h3>Heading</h3>
                            <p><a href="#">Yadda Yadda Yadda</p>
                        </div>
                        <div class="interact" style="display:none;">
                            <ul>
                                <li><a href="#">Choice1</a></li>
                                <li><a href="#">Choice2</a></li>
                                <li><a href="#">Choice3</a></li>
                            </ul>
                        </div>
                    </div>

So basically when I hover over a recent-question div i would like the div.interact to fade in or appear at all. The above code is for jquery but I am required to use prototype for this project. Any help converting would be greatly appreciated.

Thanks!