How to force Jquery to check for CHECKED boxes last, after checking for NOT CHECKED?

I have checkboxes to filter what DIVs appear on the page. I have the code in this fiddle and also below.

This code works, but the issue is with the "Country" checkboxes. If you uncheck "Argentina," the blue div goes away. But it should stay because it also has "Brazil" and "Mexico" in its data-country field.

In other words, the blue div should only disappear if ALL three checkboxes under "Country" are unchecked.

I believe this is happening because my code loops through the CHECKED checkboxes first and shows them, and THEN loops through the UNCHECKED checkboxes and hides them. So it's seeing Brazil and Mexico are checked and shows technically shows them for a split second, but then immediately sees Argentina is unchecked, so it ultimately hides it.

My thought was to reverse the order in how I'm looping through, i.e. loop through UNCHECKED first and then CHECKED. So I switched that in the Jquery but it stopped working at all. No idea why that would break it.

If anyone has any ideas on how to do this properly and/or how to make it work if I reverse the order of how I'm looping, please let me know.

HTML:

<div class="Row sel" style="background: #eeeeee;" data-region="Americas" data-country="Brazil" data-tier="Elite Reseller">
<div class="Heading">Allegiant Technology</div>
<div class="Copy">Brazil</div>
<div class="Copy">Elite Reseller</div>
</div>

<div class="Row sel" style="background: red;" data-region="APAC" data-country="Mexico" data-tier="Preferred Reseller">
<div class="Heading">Folco Communications</div>
<div class="Copy">Mexico</div>
<div class="Copy">Preferred Reseller</div>
</div>
<div class="Row sel" style="background: blue;" data-region="EMEA" data-country="Argentina, Mexico, Brazil" data-tier="Authorized Reseller">
<div class="Heading">Latin Telecom</div>
<div class="Copy">Argentina; Mexico; Brazil</div>
<div class="Copy">Authorized Reseller</div>
</div>


<div style="text-align:left; max-width: 1000px;  margin-left: auto;  margin-right: auto;  padding-left: 50px;">
<span class="title">Region:</span><br>
<input class="css-checkbox" type="checkbox" id="APAC" data-type="region" data-value="APAC" checked > 
<label for="APAC" class="css-label">APAC</label>
<input class="css-checkbox" type="checkbox" id="EMEA" data-type="region" data-value="EMEA" checked>
<label for="EMEA" class="css-label">EMEA</label>
<input class="css-checkbox" type="checkbox" id="Americas" data-type="region" data-value="Americas" checked>
<label for="Americas" class="css-label">Americas</label>
<br>
<br>
<span class="title">Partner Type:</span><br>
<input class="css-checkbox" type="checkbox" id="Preferred" data-type='tier'  data-value='Preferred Reseller' checked>
<label for="Preferred" class="css-label">Preferred</label>
<input class="css-checkbox" type="checkbox" id="Elite" data-type='tier'  data-value='Elite Reseller' checked>
<label for="Elite" class="css-label">Elite</label>
<input class="css-checkbox" type="checkbox" id="Authorized" data-type='tier'  data-value='Authorized Reseller' checked>
<label for="Authorized" class="css-label">Authorized</label>
<br>
<br>
<span class="title">Country:</span><br>
<input class="css-checkbox" type="checkbox" id="Argentina" data-type='country'  data-value='Argentina' checked>
<label for="Argentina" class="css-label">Argentina</label>
<input class="css-checkbox" type="checkbox" id="Brazil" data-type='country'  data-value='Brazil' checked>
<label for="Brazil" class="css-label">Brazil</label>
<input class="css-checkbox" type="checkbox" id="Mexico" data-type='country'  data-value='Mexico' checked>
<label for="Mexico" class="css-label">Mexico</label>
</div>

JS:

$('[type="checkbox"]').on('change', function () {
  $('[type="checkbox"]:checked').each( function (ind, inp) { //loop over checked checkboxes
    var type = inp.dataset.type, value = inp.dataset.value; 
    $('div[data-' + type +'*="' + value +'"]').show();  
  })
  $('[type="checkbox"]:not(:checked)').each( function (ind, inp) { //loop over unchecked checkboxes
    var type = inp.dataset.type, value = inp.dataset.value; 
    $('div[data-' + type +'*="' + value +'"]').hide();  
  })    

});