hide header div when table has no rows using css [duplicate]

Updated Snippet :

if($(".myTable tr").length > 0){
	alert('row present')
}else{
	$('.header').hide();
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
  <div class="header">ADDITIONAL ITEMS:</div>
  <div class="clearfix"></div>
  <div class="table-responsive m-t">
    <table class="myTable">
     <!--<tr></tr>-->
    </table>
  </div>
</div>

You can not use pure css,you in css can not first check childrens of table,if table have children(in here tr) show .header else hide .header,because css have not backward.you must use jquery.

$(document).ready(function(){
  if(!$('.myTable').find('tr').length) 
    $('.header').hide();
})

$(document).ready(function(){
  if(!$('.myTable').find('tr').length) 
    $('.header').hide();
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<div class="row">
  <div class="header">ADDITIONAL ITEMS:</div>
  <div class="clearfix"></div>
  <div class="table-responsive m-t">
    <table class="myTable">
    </table>
  </div>
</div>

You can't select a previous element because CSS does not work backwards (Hence, Cascading Style Sheet)

BUT, If you really want to use only CSS, you can use flex:

https://jsfiddle.net/0d7402sm/

#flex { 
  display: flex; 
  /* Optional, if you want the DIVs 100% width: */ 
  flex-direction: column;
}

.myTable:empty ~ .header {
  display:none;
}

#flex > .myTable { order: 2; }
#flex > .header { order: 1; }