javascript - このセレクターを使用して特定の画像を選択します

Question

thisslectorの使用に問題があります。写真が入ったdivがいくつかあります。そして、写真にクラスを適用してグレースケールにし、リンクにカーソルを合わせると、クラスを削除したいと思います。html は次のようになります。

div class="box">
    <a class="articol" href="#">
      <img src="image.jpg">
      <p>some text</p>
    </a>
</div>
div class="box">
    <a class="articol" href="#">
      <img src="image.jpg">
      <p>some text</p>
    </a>
</div>

そして、jsは次のようになります：

$(function() {
  $("a.articol").hover(function(){
     $(".box img.desaturate").removeClass('desaturate');
  }, function() {
     $(".box img").addClass('desaturate');
});});

.desaturate唯一の問題は、クラスを削除するためにホバリングしている画像のみが必要なことです。ただし、すべての画像からクラスが削除されます。

Answer 1

$(function() {
  $("a.articol").hover(function(){
     $(this).find("img.desaturate").removeClass('desaturate');
  }, function() {
     $(this).find("img").addClass('desaturate');
});});

Answer 2

$('.articol').hover(function(){
     $(this).children('img').removeClass('desaturate');
  }, function() {
     $(this).children('img').addClass('desaturate');
});