Get all elements without child node in jQuery
jquery
Solution
How about
$("span:not(:has(*))")
Selects all spans that have no children.
Explanation
The `:has()` selector "selects elements which contain at least one element that matches the specified selector." The wildcard `*` means all elements.
The expression `$('div:has(p)')` matches a `<div>` if a `<p>` exists anywhere among its descendants, not just as a direct child.
The `:not()` selector "selects all elements that do not match the given selector."
In this case, `:has()` selects everything and then we use `:not()` to find the elements that don't match "everything"... in other words, nothing.
Demo
Problem
I need to select elements without child node (including text since in `<p>` text is a child node). I used `empty`, but it also consider space as child node. Example: Markup: ``` <span> </span> <span></span> ``` Script: ``` $("span:empty").html("this was empty!"); ``` Unfortunately, only the second element were selected and changed since the first element has space and it was considered child node. How do I select elements without child node? I want to consider a space as nothing. Preferably, I want the code not to use loop to select them, there might be other ways.