CODEWITHSUNDEEP
javascriptjquerycss
pee2pee
pee2pee

Reputation: 3792

jQuery - Hide DIV which has a span element with certain text inside

I have several divs with the same class names and varying IDs. The ID is not set for the text I need to target

I need to target the Telephone Call text. If the div contains that text, how do I hide the containing div

<div id="rn_FieldDisplay_155" class="rn_FieldDisplay rn_Output">
   <span class="rn_DataLabel">Telephone Call </span>
   <div class="rn_DataValue">No</div>
</div>

I have tried the following to no avail

<script>
$(document).ready(function() {
  $(".rn_FieldDisplay > span:contains('Telephone Call')").hide ();
});
</script>

Upvotes: 2

Views: 3315

Answers (4)

Jennifer Goncalves
Jennifer Goncalves

Reputation: 1512

If your code is hiding the span, but not the parent div, you can target the div to be hidden using mostly the same code you already wrote.

$(document).ready(function() {
  $(".rn_FieldDisplay > span:contains('Telephone Call')").parent().hide();
});

Upvotes: 5

Krystian Kupiec
Krystian Kupiec

Reputation: 75

Well you can try this:

if ($(".rn_FieldDisplay > span:contains('Telephone Call')").length > 0) {
    $(".rn_FieldDisplay > span").hide();
}

Upvotes: 0

prasanth
prasanth

Reputation: 22490

Try with find() function

$(document).ready(function() {
    $(".rn_FieldDisplay").find(":contains('Telephone Call')").hide ();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="rn_FieldDisplay_155" class="rn_FieldDisplay rn_Output">
    <span class="rn_DataLabel">Telephone Call </span>
    <div class="rn_DataValue">No</div>
        <p class="rn_DataLabel">Telephone Call </p>
</div>

Upvotes: 0

Zenoo
Zenoo

Reputation: 12880

Try selecting it's child instead of the element itself :

$(document).ready(function() {
    $(".rn_FieldDisplay *:contains('Telephone Call')").hide ();
});

Upvotes: 0

Related Questions