remove css :hover attribute with jquery

Unfortunately it is impossible to manage CSS pseudo-classes with jQuery.

I'd suggest you to manipulate classes, as follows:

<style>
    .red:hover{background:red}
</style>

<div id="container" class="red"><input type="submit"></div>

<script>
    $("#container").removeClass("red");
</script>

You can't remove pseudo-class rules, but you can override them with event bindings:

$("#container").on('mouseover', function () {
   $(this).css('background', 'blue');
}).on('mouseout', function () {
   $(this).css('background', whateverItIsNormally);
});

This may be a bit convoluted and could certainly use optimization, but you could use a combination of things posted so far:

jsFiddle: http://jsfiddle.net/psyon001/Vcnvz/2/

<style>
    .red{background:red;}
</style>

<div id="container"><input type="submit"></div>

<script>
$('#container').on({
    'mouseenter' : function(){
        $(this).addClass('red');
    },
    'mouseleave' : function(){
        $(this).removeClass('red');
    }
});
$('#container').find('input').on({
    'mouseenter' : function(){
        $('#container').removeClass('red');
    },
    'mouseleave' : function(){
        $('#container').addClass('red');
    }
})
</script>