Hiding a div with specific text as content

Question

Hello. I've got a DIV I want to hide, but I cannot give it a specific ID... actually I cannot change the text of the DIV, since it is retrieved from a database, but I can add some html before it AND I know the exact text content of the DIV.

It's something like:

<div class="this_div">content_of_this_div</div>

So, I thought that maybe looking for the specific content, then taking the div and incapsulating it in a hidden div could work... or something similar... any idea?

thanks

Answer 1

Wrap it in your own div would seem most sensible.

<div id="mydiv">
  <div class="this_div">content_of_this_div</div>
</div>

then hide your div:

document.getElementById("mydiv").style.display="none";

Or, use jQuery. If that is only instance of class, you could do

$(".this_div").hide();

Answer 2

If you can insert other HTML around it then you can use another div to hide it

Using CSS and HTML

.hidden { display: none; }   
...  
<div class="hidden"><div class="this_div">content_of_this_div</div></div>

Using HTML and Inline CSS

<div style="display: none;"><div class="this_div">content_of_this_div</div></div>

Answer 3

If you just want to be able to select it without giving it a specific id, you can do a number of things. Make an empty div with an id before, then use the direct sibling selector:

#divid+div {}

or use many other css selectors to accomplish same

But I do reccomend the aforementioned external div technique over this