[Malleys]

Dilettante_Pro, ваш скрипт работает правильно только для этого конкретного случая... попробуйте

@media all {
  .buttonRED:hover, .test {
    background-color: #ee5f5b;
  }

  .buttonRED {
    background-color: #B61E29;
    border: 1px solid #000;
    width:100px;
  }
  
  .buttonRED:active {
    background: #ff6;
  }
}

UPD

<style>
.buttonRED {
	background-color: #B61E29;
	border: 1px solid #000;
	width:100px;
}
.buttonRED:hover {
	background-color: #ee5f5b;
}
 
.buttonRED:active {
	background: #ff6;
}

@media all {
	.buttonRED:hover, .test {
		background-color: #ee5f5b;
	}

	.buttonRED {
		background-color: #B61E29;
		border: 1px solid #000;
		width:100px;
	}

	.buttonRED:active {
		background: #ff6;
	}
}

</style>
<div class="buttonRED">Красная кнопка</div>
<button id="clear">Удалить стили</button>
<script>

clear.onclick = function () {
	for(const styleSheet of document.styleSheets) {
		process(styleSheet.cssRules)
	}

	function process(cssRules) {
		for(const rule of cssRules) {
			if(rule instanceof CSSStyleRule) {
				rule.selectorText = rule.selectorText.replace(/\.buttonRED:(hover|active)/g, "#a:not(#b)");
			}

			if(rule instanceof CSSMediaRule) {
				process(rule.cssRules)
			}
		}
	}
}

</script>

Замена на a:not(b) является способом не поломать составной селектор!
Замена на #a:not(#b) является способом не поломать составной и сложный селекторы!