[jQuery] css :hover problem

Hi,

i just don't get it. This is what I have:

a {
background: url(../images/test.jpg) no-repeat scroll 0 0;
}
a:hover {
background: url(../images/test.jpg) no-repeat scroll -228px 0;
}

Now, when I call
$('a').css('background-position', '-500px 0');

the CSS forgets about a:hover.
1. Why?
2. How can I set a:hover in jQuery? $('a:hover').css('background-
position', '-228px 0') doesn't work... (and I don't want to use jQuery
hover() events

Cheers
Konstantin