番号が50より大きいすべての要素項目を選択してください

Question

class="element-item"のdivが多数あります。クラス.element-itemのdivをすべて選択し、class="number"がjQueryを使用して50を超えるようにしたいとします。

<div class="element-item one " data-category="one"> 
    <h3 class="name">Mercury</h3> 
    <p class="symbol">Hg</p> 
    <p class="number">30</p> 
    <p class="weight">200.59</p> 
</div> 
<div class="element-item two " data-category="two"> 
    <h3 class="name">Mercury</h3> 
    <p class="symbol">Hg</p> 
    <p class="number">60</p> 
    <p class="weight">200.59</p> 
</div> 
<div class="element-item two " data-category="three"> 
    <h3 class="name">Mercury</h3> 
    <p class="symbol">Hg</p> 
    <p class="number">80</p> 
    <p class="weight">200.59</p> 
</div> 

Answer 1

とdivをフィルタリングする.filter()を使用することができます。ウル場合の

：

$(".element-item").each(function(){ 
    if(parseInt($(this).find(".number").html()) > 50){ 
      // This is .element-item div with number greater Than 50! 
      // Try to alert its name 
      alert($(this).find(".name").html()); 
    } 
} 

Answer 2

あなたはUはjqueryの各（）関数を使用することができvalue > 50

var divs = $('.element-item .number').filter(function(){ 
 
    return parseInt($(this).text()) > 50; 
 
}); 
 

 
//add a specail class 
 
divs.each(function(){ 
 
     $(this).addClass('special') 
 
}); 
 

 
console.log(divs.length);

.special { 
 
background-color: #eee; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="element-item one " data-category="one"> 
 
    <h3 class="name">Mercury</h3> 
 
    <p class="symbol">Hg</p> 
 
    <p class="number">30</p> 
 
    <p class="weight">200.59</p> 
 
</div> 
 
<div class="element-item two " data-category="two"> 
 
    <h3 class="name">Mercury</h3> 
 
    <p class="symbol">Hg</p> 
 
    <p class="number">60</p> 
 
    <p class="weight">200.59</p> 
 
</div> 
 
<div class="element-item two " data-category="three"> 
 
    <h3 class="name">Mercury</h3> 
 
    <p class="symbol">Hg</p> 
 
    <p class="number">80</p> 
 
    <p class="weight">200.59</p> 
 
</div>