After Ajax request hover event doesn't load to image thumbail to display bigger image - datatables

Question

I use datatables tot display a thumbnail in the first column. With jquery I display the original bigger picture when I hover the thumbnail.
Everything works fine until I decided to load the content into the table via Ajax. The hover event won't bind to the thumnail.
I tried all sorts of things. Read something about delagate, but can't get it to work. Can anyone help me?
<tr role="row" class="odd">
<td class="dtr-control"><a href="../images/cont/257.jpg" class="hover">
<img src="../images/redcont_thumb/1757.jpg" class="mediabank-preview-thumbnail"></a>
</td>
<td>Description</td>
</tr>
Hover Jquery code:
$('a.hover').hover(function(e){
var href = $(this).attr('href');
$('<img id="largeImage" src="' + href + '" alt="image" />')
.css({'top':e.pageY + offsetY,'left':e.pageX + offsetX})
.appendTo('body');
}, function(){
$('#largeImage').remove(); // Delete displaying picture
});
$('a.hover').mousemove(function(e){
$('#largeImage').css({'top':e.pageY + offsetY,'left':e.pageX + offsetX});
});
$('a.hover').click(function(e){
e.preventDefault();
});
UPDATE:
Hover won't work, so I uses 'mouseenter' and 'mouseleave'. Everything works fine.
// Hover images
var offsetX = 20;
var offsetY = -250
$('#table_mediaBank').on('mouseenter', 'a.hover', function (e) {
var href = $(this).attr('href');
$('<img id="largeImage" src="' + href + '" alt="image" />')
.css({'top':e.pageY + offsetY,'left':e.pageX + offsetX})
.appendTo('body');
});
$('#table_mediaBank').on('mouseleave', 'a.hover', function () { // Verwijder het displayen van de afbeelding
$('#largeImage').remove();
});
$('#table_mediaBank').on('mousemove', 'a.hover', function (e) { verplaatsen
$('#largeImage').css({'top':e.pageY + offsetY,'left':e.pageX + offsetX});
});
$('#table_mediaBank').on('click', 'a.hover', function (e) {
e.preventDefault();
});