ผมพึ่งหัดเขียน jquery อะครับ ลองทำ .hover addClass ดูแล้ว ติดปัญหาเลยอยากขอคำชี้แนะหน่อยอะครับ

$(".menu").hover(
  function () {
    $(this).addClass('hover');
      $(".arrow").removeClass('hide');
  }, 
  function () {
    $(this).removeClass('hover');
    $(".arrow").addClass('hide');
  }
  );

<style>
.hover{
    color:green;
}
.menu{
    float:left;
}
.arrow{
    width: 50px;
    height: 10px;
    margin: 0  0 0 50px;
    float:left;
    background: #000000;
}
.hide{
    display:none;
}
</style>
<div class="menu"> menu  </div><div class="arrow hide"></div><br/>
<div class="menu"> menu  </div><div class="arrow hide"></div><br/>
<div class="menu"> menu  </div><div class="arrow hide"></div><br/>
<div class="menu"> menu  </div><div class="arrow hide"></div><br/>