jquery how to color area dynamically

Question

I have image map like this

<map name="imgmap">
<area shape="poly" coords="63,10,64,38,89,37,91,10" href="#" id="x1"></map>

and how can I color that area dynamically with jquery like

("#x1").color('red')

?

Answer 1

Originally I thought that this might work:

$("#x1").css("background-color", 'red')

However, upon further investigation it become quite clear that there is no easy way to do what you want.
Perhaps, your aim could be achieved by absolute positioning of the special images under your main image and poping them up on $("#x1").hover().

Answer 2

you can try using the maphilight plugin of jquery. it does what you want to achieve - http://davidlynch.org/blog/2008/03/maphilight-image-map-mouseover-highlighting/