JSFiddle - React, Tailwind, and code Playground

HTML

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

   <div class="medal">
      <div class="da"></div>
      <div class="po"></div>
      <div class="projects"></div>
      <div class="opens"></div>
      <div class="effect"></div>
      <div class="potencial"></div>
   </div>
</div>
<div class="person">
   <div class="face">Second<img src="img.jpg"></div>
   <div class="info"></div>

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

CSS

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

JavaScript

$('.person').each(function(){
	var $nodes=$(this).find('.medal > div');
  if($nodes.length==$nodes.filter(':empty').length){
    $(this).find('.face').addClass('empty');
  }
});