jquery - find element that only has text and not any other html tag

Question

I need to check with jquery that a anchor element only has text in it and not any other tag (img, b) or any thing else.

<a href="">TV</a>

Should be found, but :

<a href=""><img /></a>

or:

<a href=""><span>TV</span></a>

or any other HTML tag, shouldn't be found.

How do i do this?

Thanks in advance.

Answer 1

We can use the filter() function to remove elements which have children (checked using the children() method).

var emptyAs = $('a').filter(function () {
    return $(this).children().length == 0;
});

You could also use the :not() selector combined with the :has() selector;

var moreEmptyAs = $('a:not(:has(*))');

You can see both of these working in the following JSFiddle; http://jsfiddle.net/JD67U/