定位.last（）的子元素

Question

如何定位.last（）元素的特定子元素。

这是我目前有：

HTML

<div class="rules-step"><select class="and_option"></select></div> 
<div class="rules-step"><select class="and_option"></select></div> 
<div class="rules-step"><select class="and_option"></select></div> 
<div class="rules-step"><select class="and_option" style="opacity:0.5"></select></div> 
<a class="deletelistitem"></a> 

JS

$(".deletelistitem").on('click', function() { 
    $(".rules-step").last().siblings('.and_option').css("opacity", "1"); 
}); 

在此先感谢。

Answer 1

的使用.find()代替.siblings()的选择是DIV的子元素：

$(".deletelistitem").on('click', function() { 
    $(this).siblings(".rules-step").last().find('.and_option').css("opacity", "1"); 
}); 

Answer 2

您可以使用children得到正确的目标，像这样： -

$(".deletelistitem").on('click', function() { 
    $(".rules-step").last().children('.and_option').css("opacity", "1"); 
}); 

FIDDLE：

请勿使用siblings。由于目标元素不是最后一个具有规则步骤类的div的siblings。这是最后一个div的子节点。