JSFiddle - React, Tailwind, and code Playground
HTML
<!-- Category #1 -->
<div class="resources-files-container">
<h3>Category #1</h3>
<ul class="attachment-list">
<li class="filter-example-1">
<a href="#">PDF Example #1</a>
</li>
<li class="filter-example-3">
<a href="#">PDF Example #3</a>
</li>
</ul>
</div>
<!-- Category #2 -->
<div class="resources-files-container">
<h3>Category #2</h3>
<ul class="attachment-list">
<li class="filter-example-2 hidden">
<a href="#">PDF Example #2</a>
</li>
<li class="filter-example-2 hidden">
<a href="#">PDF Example #2</a>
</li>
</ul>
</div>
CSS
.hidden{
display: none;
}
JavaScript
$(".resources-files-container").filter(function(){
return $(this).find("li:visible").length == 0;
}).hide();