jQuery Выбор одного из нескольких элементов с тем же классом

Question

Попытка написать простой скрипт, который изменит цвет фона элемента с определенным классом (.global__image-outer-wrap - game-medium), если «a» в другом классе, а также в качестве родителя обоих (.giveaway__row-outer-wrap) имеет определенный класс (giveaway__column-group) в случае, когда есть несколько элементов с (.giveaway__row-outer-wrap).

if ($(".giveaway__row-outer-wrap,a").hasClass("giveaway__column--group")){ 
    $(.global__image-outer-wrap--game-medium").css("background-color", "limegreen")}; 

TL; DR Несколько элементов с одинаковым классом; Мне нужно выбрать только те, в которых «a» имеет определенный класс.

HTML сайта я пытаюсь применить сценарий к

<div class="giveaway__row-outer-wrap"> 
    <div class="giveaway__row-inner-wrap"> 
    <div class="giveaway__summary"> 
     <h2 class="giveaway__heading"> 
     <a class="giveaway__heading__name" href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered">Fahrenheit: Indigo Prophecy Remastered</a><span class="giveaway__heading__thin">(10P)</span><a class="giveaway__icon" rel="nofollow" target="_blank" href="http://store.steampowered.com/app/312840/"><i class="fa fa-steam"></i></a><i data-popup="popup--hide-games" data-game-id="3962555" class="giveaway__icon giveaway__hide trigger-popup fa fa-eye-slash"></i> 
     </h2> 
     <div class="giveaway__columns"> 
     <div><i class="fa fa-clock-o"></i> <span title="Today, 11:59pm">1 minute remaining</span></div><div class="giveaway__column--width-fill text-right"><span title="February 16, 2015, 4:03pm">4 days ago</span> by <a class="giveaway__username" href="/user/UraniumFalconPunch">UraniumFalconPunch</a></div><a href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered/groups" class="giveaway__column--group"><i class="fa fa-fw fa-user"></i></a></div> 
     <div class="giveaway__links"> 
     <a href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered/entries"><i class="fa fa-tag"></i> <span>10 entries</span></a> 
     <a href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered/comments"><i class="fa fa-comment"></i> <span>10 comments</span></a> 
     </div> 
    </div><a href="/user/UraniumFalconPunch" class="global__image-outer-wrap global__image-outer-wrap--avatar-small"><div class="global__image-inner-wrap" style="background-image:url(https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/ef/ef653aea58e8709fd6e13f5fa2b39e3fe7b8e5a9_medium.jpg);"></div></a><a class="global__image-outer-wrap global__image-outer-wrap--game-medium" href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered"><div class="global__image-inner-wrap" style="background-image:url(http://cdn.akamai.steamstatic.com/steam/apps/312840/capsule_184x69.jpg);"></div> 
    </a> 
    </div> 
</div> 

Там в нескольких див с классом giveaway_row-внешний обручем, но не все имеют «» элементы с giveaway__column-группа классом.

Answer 1

Используйте .has() для выбора элементов, содержащих элементы, соответствующие селектору.

$(".giveaway__row-outer-wrap").has("a.giveaway__column--group").each(function() { 
 
    $(".global__image-outer-wrap--game-medium", this).css("background-color", "limegreen") 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="giveaway__row-outer-wrap"> 
 
    <div class="giveaway__row-inner-wrap"> 
 
    <div class="giveaway__summary"> 
 
     <h2 class="giveaway__heading"> 
 
      <a class="giveaway__heading__name" href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered">Fahrenheit: Indigo Prophecy Remastered</a><span class="giveaway__heading__thin">(10P)</span><a class="giveaway__icon" rel="nofollow" target="_blank" href="http://store.steampowered.com/app/312840/"><i class="fa fa-steam"></i></a><i data-popup="popup--hide-games" data-game-id="3962555" class="giveaway__icon giveaway__hide trigger-popup fa fa-eye-slash"></i> 
 
      </h2> 
 
     <div class="giveaway__columns"> 
 
     <div><i class="fa fa-clock-o"></i> <span title="Today, 11:59pm">1 minute remaining</span> 
 
     </div> 
 
     <div class="giveaway__column--width-fill text-right"><span title="February 16, 2015, 4:03pm">4 days ago</span> by <a class="giveaway__username" href="/user/UraniumFalconPunch">UraniumFalconPunch</a> 
 
     </div><a href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered/groups" class="giveaway__column--group"><i class="fa fa-fw fa-user"></i></a> 
 
     </div> 
 
     <div class="giveaway__links"> 
 
     <a href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered/entries"><i class="fa fa-tag"></i> <span>10 entries</span></a> 
 
     <a href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered/comments"><i class="fa fa-comment"></i> <span>10 comments</span></a> 
 
     </div> 
 
    </div> 
 
    <a href="/user/UraniumFalconPunch" class="global__image-outer-wrap global__image-outer-wrap--avatar-small"> 
 
     <div class="global__image-inner-wrap" style="background-image:url(https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/ef/ef653aea58e8709fd6e13f5fa2b39e3fe7b8e5a9_medium.jpg);"></div> 
 
    </a> 
 
    <a class="global__image-outer-wrap global__image-outer-wrap--game-medium" href="/giveaway/fteQx/fahrenheit-indigo-prophecy-remastered"> 
 
     <div class="global__image-inner-wrap" >This should be lime green</div> 
 
    </a> 
 
    </div> 
 
</div>