Edit in JSFiddle

h1{font-size: 20px;}
table {width: 100%;}
ul {list-style-type: none;}
tr{ height: 2em; border: 1px solid black; }
tr, tr.hidden:nth-child(even) + tr:nth-of-type(odd) + tr:nth-of-type(even) {
    background: khaki;     
}

tr:nth-child(even),
tr.hidden:nth-child(even) ~ tr:nth-of-type(odd) { 
    background: indianred; 
}

.hidden { display: none; }

var rows = document.querySelectorAll('tr');
var clicked = 0;
document.querySelector('button').addEventListener('click', function(ev) {
    if (clicked === 0) {
         rows[3].className = 'hidden';
    } else {
         rows[4].className = 'hidden';
    }
clicked++;    
}, false);