Pantela,
шифровка из центра для варианта на классах ...
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.row.sale .reportPrice{
text-decoration:line-through;
color:#dd5a43;
font-weight: normal;
}
.row.sale .reportPriceDiscount,.reportPrice{
color:#69aa46;
font-weight: bold;
}
.reportPriceDiscount{
color:#ccc;
}
.row.ok.sale .reportPriceDiscount:after,.row.ok .reportPrice:after{
content:"✓";
margin-left:5px;
font-size:12px;
font-weight:bold;
}
.row.ok.sale .reportPrice:after{
content:"";
}
#finalPriceBlock{
display:none;
font-weight:700;
font-size:18px;
}
#orderCalcBalanceBlockAlert{
display:none;
}
#finalPrice{
color:hsla(120,100%,25%,1);
}
#finalPrice.red {
color:hsla(0,100%,50%,1);
}
#allPrice{
color: hsla(240, 100%, 50%, 1);
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
$(".row .report").on("change", function() {
var a = 0, //общая сумма
b = +$("#balance").val() || 0,//балланс
k = 0;//сумма без скидки
$(".row").each(function(d, e) {
var f = $(".report", e), //инпут в блоке
c = f.data(), //все дата из этого инпут
b = c.discountwith.split(",")[c.discountrule](function(a) {
return $(".row [name='" + a + "']").is(":checked")
}); //скидка (true/false) -- не путать с баллансом
$(e).toggleClass("sale", b);//установка-удаление класса блок со скидкой
$(e).toggleClass("ok", f[0].checked);// установка-удаление класса блок выбран
a += f[0].checked ? b ? +c.pricediscount : +c.price : 0; //подсчёт суммы с текущими скидками
//если чекед плюсуем к общей сумме цену инпут со скидкой (b=true, c.pricediscount) или без (b=false, c.price)
f[0].checked && (k += +c.price); //подсчёт суммы без скидок
});
//вывод сумм и блоков предуреждения
$("#finalPrice").text(a).css("opacity", 0).fadeTo(900, 1).toggleClass("red",a > b);
$("#allPrice").text(k);
var d = ["#finalPriceBlock", "#orderBlockAlert"];
a && d.reverse();
$(d[0]).stop().fadeOut(300, function() {
$(d[1]).stop().fadeIn(300)
});
$("#orderCalcBalanceBlockAlert")[a > b ? "fadeIn" : "fadeOut"]()
}).eq(0).change()
});
</script>
</head>
<body>
<div id="usa" class="row">
<div class="reportPrice">5 USD</div>
<div class="reportPriceDiscount"><span>4 USD</span></div>
Usa <input type="checkbox" name="usa" class="report" data-price="5" data-pricediscount="4" data-discountrule="some" data-discountwith="russia"/>
</div>
<br/ >
<div id="russia" class="row">
<div class="reportPrice">7 USD</div>
<div class="reportPriceDiscount"><span>5 USD</span></div>
Russia <input type="checkbox" name="russia" class="report" data-price="7" data-pricediscount="5" data-discountrule="some" data-discountwith="usa"/>
</div>
<br/ >
<div id="spane" class="row">
<div class="reportPrice">12 USD</div>
<div class="reportPriceDiscount"><span>9 USD</span></div>
Spane <input type="checkbox" name="spane" class="report" data-price="12" data-pricediscount="9" data-discountrule="every" data-discountwith="usa,russia"/>
</div>
<br/ >
<div id="japan" class="row">
<div class="reportPrice">7 USD</div>
<div class="reportPriceDiscount"><span>5 USD</span></div>
Japan <input type="checkbox" name="japan" class="report" data-price="7" data-pricediscount="5" data-discountrule="some" data-discountwith="china,korea"/>
</div>
<br/ >
<div id="china" class="row">
<div class="reportPrice">9 USD</div>
<div class="reportPriceDiscount"><span>3 USD</span></div>
China <input type="checkbox" name="china" class="report" data-price="9" data-pricediscount="3" data-discountrule="some" data-discountwith="japan,korea"/>
</div>
<br/ >
<div id="korea" class="row">
<div class="reportPrice">8 USD</div>
<div class="reportPriceDiscount"><span>4 USD</span></div>
Korea <input type="checkbox" name="korea" class="report" data-price="8" data-pricediscount="4" data-discountrule="some" data-discountwith="japan,china"/>
</div>
<br/ >
<!-- Final price -->
<div id="finalPriceBlock">
<div class="col-md-12 center">
<div class="form-group">
Total price: <span id="finalPrice"></span> USD
</div>
<div class="form-group">
All price: <span id="allPrice"></span> USD
</div>
</div>
</div>
<!-- Final price -->
<!-- Alert -->
<div class="col-md-6 col-md-offset-3 col-xs-12">
<div class="form-group" id="orderBlockAlert">
Status: Warning
</div>
<div class="form-group" id="orderCalcBalanceBlockAlert">
Status: Danger
</div>
</div>
<!-- Alert -->
<br/ ><br/ >
Balance: <input name="balance" id="balance" type="text" value="15" />
</body>
</html>