jQuery: Search for div containing specific mark up

Question

I'm stuck with a editor that outputs <p><br></p> when the textfield is empty and now I want to target the divs with that none content.

I've been trying .filter, text lengths, :contains, .html and what not but can't seem to find a way to look for a <div> that contains that mark up.

Other <div> may contain that and some text which would be just normal and fine, so I will need to target the code below specifically.

<div>
  <p>
    <br>
  </p>
</div>

Any idea how to approach this?

Answer 1

Try this...

var $div = $("div").filter(function() {
    return this.innerHTML.replace(/\s+/g, '').toLowerCase() == "<p><br></p>";
});

The resulting object ($div) will be a jQuery collection of the divs you're interested in.

Answer 2

Try this jquery code :

$('div').each(function() {
    if ($.trim($(this).text) == '') {
        $(this).remove()
        // or maybe : $(this).empty()
    }
})