JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Original</h1>
<div><ul><li>An item</li></ul></div>

<h1>No Children - Match</h1>
<div></div>

<h1>Has a Child - No Match</h1>
<div><ul></ul></div>

<h1>Has Text - No Match</h1>
<div>text</div>

CSS

H1 { font-size: 24px; }

DIV {
 background-color: red;
 height: 20px;    
}

DIV:empty {
 background-color: green;
}