How can i hide a div when another div contains specific text?

Question

I have a page with the following code:

<div class="box1">Free</div>
<div class="box2">$100</div>

I want to check the page and every time the "box1" div contains the text "Free" to remove entirely the "box2" div.

I tried something like that with jQuery

$('.box1("Free")') {
$('.box2').hide();
}

but doesn't work. What i 'm doing wrong?

Possible duplicate of [jquery find element by text](https://stackoverflow.com/questions/7321896/jquery-find-element-by-text) — Andreas, Jan 20 '18 at 19:21
@JoshKisb Actually it's better to check for `.text() === 'Free'` — blurfus, Jan 20 '18 at 19:29

score 2 · Accepted Answer · answered Jan 20 '18 at 19:22

2

Use text() method to retrieve text from box1

if ( $('.box1').text() === 'Free' ) {
  $('.box2').hide();
}

answered Jan 20 '18 at 19:22

Arkej

score 2 · Answer 2 · answered Jan 20 '18 at 19:23

2

This snippet will be helpful:

if($('.box1').text() === "Free") {
  $('.box2').hide();
}

answered Jan 20 '18 at 19:23

Ihor Lavs

Yep! it worked its the same answer already posted @Arkej Thanks anyway ;) – Designer Jan 20 '18 at 19:25

score 0 · Answer 3 · answered Jan 20 '18 at 19:26

0

Use this

$(document).ready(function (){
            $('.box1:contains(Free)') {
                 $('.box2').hide();
      }
   });

answered Jan 20 '18 at 19:26

Negi Rox

3 Answers3