javascript - 循环每个 div 然后应用 css

Question

我正在尝试循环一组具有相同类的 div 并运行一些 jquery。第一个 div 运行正确，但接下来的 3 个 div 应用相同的 css，而不是再次运行。我已经尝试了一些方法，但仍然无法正常工作。目前我的jquery

$('div.service-card').each(function() {
   var test = $(this).find('.shbw').outerWidth();
   $('.service-triangle').css('right', test + 'px');
});

和 html

<div class="service-card">    
    <div class="service-triangle"></div>
    <span class="shbw">Test 1</span>
</div>
<div class="service-card">    
    <div class="service-triangle"></div>
    <span class="shbw">Test 2</span>
</div>
<div class="service-card">    
    <div class="service-triangle"></div>
    <span class="shbw">Test 3</span>
</div>
<div class="service-card">    
    <div class="service-triangle"></div>
    <span class="shbw">Test 5</span>
</div>

知道如何将它单独应用到每个 div 吗？

Answer 1

使用find()从当前div.service-card中选择元素.service-triangle

$('div.service-card').each(function() {
   var test = $(this).find('.shbw').outerWidth();
   $(this).find('.service-triangle').css('right', test + 'px');
});