populate a div on mouseover on textbox inside gridview in jq

i have a grid view ...

 

i need to populate a div obove the textbox on mouse over inside the gridview , 

 

its working properyly on some of the text i need to display the div when the cursor move into the td the div will show with corresponding value on above the text box , and on other td the previous div hide and show new on corresponding div

 

 

 

 

 

 

here is the code :

 

  function storevalue(obj) {

$('#TestDiv1').hide();
var pos = $(obj).offset();
$('#TestDiv1').show('slow');
$('#TestDiv1').offset({ top: pos.top-30, left: pos.left-30 });
//alert(pos.top); alert(pos.left);


$('#sidebarPage1').show();
var gridview = $(".arrowkeygv");
$.keynavigation(gridview);

obj.style.backgroundColor = "#DFEBF4";
var curmark = parseFloat(obj.value, 10);
var chk = obj.value

if (!isNaN(curmark)) {
document.getElementById('ctl00_ContentPlaceHolder1_HiddenField3').value = curmark;
}
else {
document.getElementById('ctl00_ContentPlaceHolder1_HiddenField3').value = chk;
}


var closest = $(obj).closest("td").index();

var Cutoff = 'ctl00_ContentPlaceHolder1_lvMarkEntry_ctl01_Cutoff' + closest;

var cut = Cutoff;

var Cutoffvalue = document.getElementById(cut).innerHTML;

var arr1 = Cutoffvalue.split("(");

var val1 = arr1[1];

var arr2 = val1.split(")");

var cutof = arr2[0];

var cutoffmark = parseFloat(cutof, 10);

// var lblElement = document.getElementbyId("lblmaxmark");
// lblElement.innerHTML(cutoffmark);
// document.getElementById('lblmaxmark').value=cutoffmark;
$('#ctl00_ContentPlaceHolder1_lblmaxmark').html('Max-Mark is ' + cutoffmark);

}

 

 

function pageLoad() {


$('.textbox1').parent('td').hover(
function() {
// var sorted = $(this).find("input[type='text']");
//
// var pos = $(sorted).offset();
$('#TestDiv1').offset({ top: pos.top - 30, left: pos.left-30 });
$('#TestDiv1').show('slow');
},
function() {
$('#TestDiv1').hide();

});

}