cha0s,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
label{
background: #228B22;
}
input:checked + label {
background: #FF3D3D;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function ()
{
$('[position_title ^= 5] label').click(function (){
var str = [];
var checked = $(this).prev().is(':checked');
var inputs = $('[position_title ^= 5] input:checkbox:checked');
inputs = checked ? inputs.not($(this).prev()) : inputs.add($(this).prev())
inputs.each(function(i) {
var text = $(this).next('label').text();
if (text.indexOf('(-$')+1) {
text = text.substring(0,text.indexOf('('));
str.push(text);
}
});
$("#fiveselect").text(str.join(', '));
});
})
</script>
</head>
<body>
<div id="fiveselect"></div>
<div id="results5"><div position_title="5" id="option-656" class="option checkbox">
<label style="display:none;">discounts:</label>
<div class="fields">
<input style="display:none;" type="checkbox" name="option[656][]" value="6142" id="option-value-6142">
<label class="spancheckbox on" style="float:left; margin-bottom:5px;" for="option-value-6142">cardstock layers(-$0.50)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6149" id="option-value-6149">
<label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6149">belly band(-$0.25)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6150" id="option-value-6150">
<label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6150">ribbon(-$0.50)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6151" id="option-value-6151">
<label class="spancheckbox" style="float:left; margin-bottom:5px;" for="option-value-6151">pocketfold name tag(-$0.15)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6152" id="option-value-6152">
<label class="spancheckbox on" style="float:left; margin-bottom:5px;" for="option-value-6152">envelope liner(-$0.25)</label>
<br>
<input style="display:none;" type="checkbox" name="option[656][]" value="6153" id="option-value-6153">
<label class="spancheckbox on" style="float:left; margin-bottom:5px;" for="option-value-6153">address wrap(-$0.50)</label>
<br>
</div>
</div></div>
</body>
</html>