Javascriptで特定のカラーを全て他の色に置き換えるには？

以下のHTMLと

<h1>hoge</h1>
<p>piyo</p>
<div>fuga</div>
<span>hena</span>

以下のCSSがあるとき

h1 {
  background: #FF0000;
}

p {
  color: #FF0000;
}

div {
  border: solid 1px #FF0000;
}

span:after {
  content: 'after:';
  color: #FF0000;
}

Javascriptで#FF0000を#0000FFに変更するには
すべての要素を繰り返し処理で回し、
さらにcolorやborder-color、background-colorの一つ一つの要素の中を覗いて
書き換える方法しか思いつかないのですが
もうすこし効率の良い方法はありますか？

また、:afterや:beforeで定義した色については
差し替え不能だと思うのですが、可能ですか？

追記：
JavascriptでDOMのクラスを書き換えることで実現する方法が紹介されましたが
そうすると置換したい色の数だけCSSの定義を増やさなければならなくなるため
sassを利用したスマートな解決方法などもございましたら
是非教えていただきたいです。