Если изображение имеет определенный тег ALT, скройте определенный div, который находится под одним и тем же родительским div, как изображение

Question

Итак, у меня есть несколько разделов продукта, которые имеют одинаковую структуру и те же классы.

<div class="product"> 
    <div class="product_image"> 
    <div class="image"> 
     <img src="http://www.placehold.it/200x200" alt="Puppy"> 
    </div> 
    </div> 
    <div class="image_description"> 
    Image Description 
    </div> 
</div> 

<div class="product"> 
    <div class="product_image"> 
    <div class="image"> 
     <img src="http://www.placehold.it/200x200" alt="Kitten"> 
    </div> 
    </div> 
    <div class="image_description"> 
    Image Description 
    </div> 
</div> 

Я хочу, чтобы скрыть DIV с классом «image_description» только в том случае, когда изображение под DIV продукта есть альт тегов Puppy.

Answer 1

Вы можете найти все .product элемент, содержащий элементы с alt=Puppy. а затем найти .image_description элемент в нем и скрывать:

$('.product:has([alt=Puppy])').find('.image_description').hide(); 

Working Demo

Answer 2

Попробуйте это:

$('img').each(function(){ 
    var element = $(this); 
    var a = element.attr('alt'); 
    if(a == 'Puppy'){ 
     element.parents('.product').find('.image_description').hide(); 
    } 
});