Detect if all textarea are empty using jquery

Question

How can I check whether a group of textareas are all empty using jquery and the textareas class "inside"? I need to check this inside a if.

<textarea id="1" class="inside"></textarea>
<textarea id="2" class="inside"></textarea>
<textarea id="3" class="inside"></textarea>
<textarea id="4" class="inside"></textarea>

Answer 1

Something like this would do it

if (! $('.inside').filter(function() {return this.value.length;}).length ) {
   // all empty
}

FIDDLE

Filters out any elements that doesn't have a value, and you could optionally use trim to account for whitespace as well "return $.trim(this.value).length;", and if the selector has no length, none of the elements have a value.

Answer 2

You could use .is(':empty') to check.

EXAMPLE HERE

$('textarea.inside').each(function(){
    if($(this).is(':empty')){
        alert('empty');
    }
});

It's worth noting that the class of each element shouldn't contain a .. Also, an id shouldn't start with a number.