Grow your CSS skills. Land your dream job.

Last updated on:

Check for Empty Elements

Do something for each empty element found:

$('*').each(function() {
         if ($(this).text() == "") {
                   //Do Something
         }
});

TRUE or FALSE if element is empty:

var emptyTest = $('#myDiv').is(':empty');

Comments

  1. Cipa
    Permalink to comment#

    This might be a bit more practical
    $(‘p,em,b,strong,span’).each(function() {
    if (jQuery.trim ($(this).text()) == “”) $(this).css(‘border’,’solid 1px red’);
    });

  2. Permalink to comment#

    Hey Chris, I think you’ve missed the single quotes around :empty

    .is(‘:empty’)

  3. Junyo
    Permalink to comment#

    Not true, how about ”

    “?It’s not empty, but it hasn’t text. I think checking childNodes property is better.

    $(‘*’).each(function() {
    if (!this.childNodes.length) {
    //Do Something
    }
    });

  4. Junyo
    Permalink to comment#

    Contents of my previous reply in the double quotes are filtered, here it is:
    <div><img/></div>

  5. Kyle
    Permalink to comment#

    Thank you Cipa! I think that trim makes a difference.

  6. sankar
    Permalink to comment#

    nice …

Leave a Comment

Posting Code

  • Use Markdown, and it will escape the code for you, like `<div class="cool">`.
  • Use triple-backticks for blocks of code.
    ``` 
    <div>
      <h1>multi-line block of code</h1>
      <span>be cool yo.</span>
    </div>
    ```
  • Otherwise, escape your code, like <code>&lt;div class="cool"&gt;</code>. Markdown is just easier though.

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".