valid JS but mouseover not working

Question

i'm struggling with the lowly mouseover to change a background image. JSLint is telling me my code is valid but it's still not working. Can you help?

http://jsfiddle.net/kxNvW/23/

html

<div class="btn large contempt">


</div>

css

.btn.large.contempt {
    background: url(http://dummyimage.com/100x100/83c79f/fff);
    width: 100px;
    height: 100px;

}

jquery

$(document).ready(function() {
 $(".btn.large.contempt").bind('mouseover', function() {
$(".btn.large.contempt").attr('background','url(http://dummyimage.com/100x100/c78383/fff)');
 });
});

Answer 1

Replace attr with css - background is a CSS property, not a HTML one.

Answer 2

Try this one: http://jsfiddle.net/kxNvW/29/