JQuery将cass改为多个div

Question

当只悬停.button时，如何添加更多类来触发？ 例如：悬停在.button上会将类添加到另一个对象。

jQuery('.button a').hover(

    function () {
        jQuery(this).parent().parent().parent().addClass('over');
    }, 
    function () {
        jQuery(this).parent().parent().parent().removeClass('over');
    }
);

Answer 1

我会使用 jquery data并执行以下操作：

    jQuery('.button a').hover(

    function () {
        jQuery(this).parent().parent().parent().addClass('over');
        var target1 = jQuery('.elem a').addClass('small');
        var div1 = jQuery('.first-div').addClass('firstdiv');
        var div2 = jQuery('.second-div').addClass('seconddiv');
        
        $(this).data('first', div1);
        $(this).data('second',div2); 
        $(this).data('target',target1); 

    }, 
    function () {
        jQuery(this).parent().parent().parent().removeClass('over');
        $(this).data('target').removeClass('small');
        $(this).data('first').removeClass('firstdiv');
        $(this).data('second').removeClass('seconddiv');
    }
    );

    .over {
      font-weight: Bold;
      font-size: 40px;
    }

    .small {
      font-style: italic;
      font-size: 12px;
    }

    .firstdiv{
      color: red;
    }
    
    .seconddiv {
      color: green;
    }
  .first-div, .second-div {
    font-size: 18px;
    font-weight: normal;
  } 
    
  .changefont {
    font-size: 30px;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="button">

    <a href="#"> BIG</a>
    </div>
    <div class="elem">

    <a href="#">ME TOO</a>
    </div>
   <div class="first-div">
    First Div
    </div>
    <div class="second-div">
    Second Div
    </div>

编辑： 我添加了额外的div来演示用法，以防其他人在这里结束。