Aniket Singh Aniket Singh - 3 months ago 8
CSS Question

How to remove div with a particular text in it

I have some div tags which has some text & elements in it & I want to remove those div's, They are looks like this

<div style="font-family:verdana;font-size:12px;">
Example
<a href="http://www.example.com" title="hey">example</a>
</div>


There are many div's like this & I want to remove them all with using jQuery or javascript

Answer

Based on Darren's answer, if you want to be extra sure (as :contains will match and delete any div containing the word example), you can make sure it's a div that has an anchor with that same example as children, then go back to the parent and remove it.

If this doesn't work, please paste a few more divs so we can see a common pattern and target it the safest way possible.

$(document).ready(function(){
  
  $('#remove').click(function(e){

  $("div:contains('Example')").children("a:contains('example')").parent("div:contains('Example')").remove()
})
  
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="font-family:verdana;font-size:12px;">Example<a href="http://www.example.com" title="hey"> example</a></div>
<div style="font-family:verdana;font-size:12px;">Don't remove<a href="http://www.example.com" title="hey"> example</a></div>
<div style="font-family:verdana;font-size:12px;">Example<a href="http://www.example.com" title="hey"> don't remove</a></div>

<button id="remove">
Remove undesired divs
</button>