jquery删除附加的样式标记

Question

我有一个代码，在div悬停时将样式添加到头部，但当我将鼠标悬停在外时，我想要销毁之前附加的样式标记，这可能吗？ 这是我的代码......

jQuery( "#diamonds div" ).hover(
  function() {
    jQuery(this).find('img.label').fadeTo( "fast", 0 );
    jQuery(this).find('.dj-social').delay(200).fadeTo( "fast", 1 );

    var className = jQuery(this).attr('class').split(' ')[1];
    jQuery('head').append('<style>.'+ className +':before {background-size:120% auto !important;}</style>');

  }, function() {
    jQuery(this).find('.dj-social').fadeTo( "fast", 0 );
    jQuery(this).find('img.label').delay(200).fadeTo( "fast", 1 );

    var className = jQuery(this).attr('class').split(' ')[1];

        // ----This is where I want to destroy the style tag i have just inserted   
        jQuery('head').remove('<style>.'+ className +':before {background-size:100% auto !important;}</style>');

  }
);

继承人我的小提琴： http ： //jsfiddle.net/XwdkC/1/

Answer 1

使用jQuery Hover切换：

$(element).hover(function() {
    $(this).addClass('yourStyle');
}, function() {
    $(this).removeClass('yourStyle');
});

Answer 2

使用类而不是修改内联样式。 这样你就可以利用jQuery的addClass()和removeClass()函数。