JSFiddle - React, Tailwind, and code Playground

HTML

<div id="person">
   <div id="face"><img src="img.jpg"></div>
   <div id="info"></div>

   <div id="medal">
      <div id="da"></div>
      <div id="po"></div>
      <div id="projects"></div>
      <div id="opens"></div>
      <div id="effect"></div>
      <div id="potencial"></div>
   </div>
</div>

CSS

.empty{
  min-height:30px;
  background:red;
}

JavaScript

$('#medal > div').toArray().every(function(item){
  return $(item).is(':empty');
}) && $('#person').addClass('empty');