The problem is that jQuery works with DOM and not drawings on canvas. What you need to do is to store those points somewhere and on hovering over the canvas element, check if the coordinates of the mouse relative to the canvas ( i.e. if you place the mouse over the top-left corner of the canvas, coords are [0,0] ) are within the area of the point/shape. If so, the point is hovered over by the mouse and you can display the effect.

Psuedocode to understand better:

// adding shapes to the canvas

var shapes = [];  // make that rects for simplicity.

For (condition):

    shapes.push ( new Rect(x,y,width,height) );

    canvas.rect( x, y, width, height );



// testing hover.

$(#canvas).mousemove(function(e) {

    var offsetX = e.pageX - $(this).position().left;

    var offsetY = e.pageY - $(this).position().top;



    Foreach shape in shapes:

        if( shape.contains(offsetX, offsetY) )    // a fictious method, implement it yourself...lookup for collision detection; not exactly that but something like that...

            Mouse hovers! do something great.

});

Ok, maybe to find out if a point is contained within a rectangle, you can use something like this:

function contains(rect, x, y) {

    return (x >= rect.x &&

            x <= rect.x + rect.width &&

            y >= rect.y && 

            y <= rect.y + rect.height )

}