Getting div to show/hide on hover in JQuery with ajax content
<p>I currently have code that shows / hides a div when another div is hovered over or off. 
This code works fine for the intial batch of data it is applied to:</p>

<pre><code>$(document).ready(function() {
    $('.eventViewWrapper').hover( function(){
        var eventId = $(this).attr('rel');
        $("#eventActions_" + eventId).show();
   },
   function(){
      var eventId = $(this).attr('rel');
      $("#eventActions_" + eventId).hide();
   });
});
</code></pre>

<p>However, when I fetch more data via an ajax post, the divs no longer show when I hover. 
I understand why this happens as it happened with previous ajax functionality and requires the implementation of the .live() method. So I made the following changes:</p>

<pre><code>$(document).ready(function() {
   $('.eventViewWrapper').live('hover', function() {
        var eventId = $(this).attr('rel');
        $("#eventActions_" + eventId).show();
   },
   function(){
      var eventId = $(this).attr('rel');
      $("#eventActions_" + eventId).hide();
   });
});
</code></pre>

<p>This now works partially as the div appears when I hover. However, when I take focus away from the div, it doesn't hide. I imagine that the second part of the code needs to have the .live() method linked to it as well, I'm just not sure how??</p>

<p>Thanks</p>
