Getting Checkbox value in JavaScript or JQuery While OnClick

I had a Checkbox I need to get the value of checkbox of while checked. either in JavaScript or jquery. I have placed my ASPX Code below. that Should Work in IE, While I am trying it is Showing response as "on" rather than value.

ASPX code:

<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="CHK_STY_ALL" runat="server" onclick="javascript:Selectallcheckbox(this);" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="CHK_STY" runat="server" onclick="javascript:SelectallColorsForStyle(this,value);" CssClass="checkboxselection" Text='<%#Eval("STY_NBR")%>' />
</ItemTemplate>
</asp:TemplateField>

JavaScript and JQuery :

<script language="javascript" type="text/javascript">
function Selectallcheckbox(val) {
if (!$(this).is(':checked')) {
$('input:checkbox').prop('checked', val.checked);
} else {
$("#chkroot").removeAttr('checked');
}
}
</script>
<script type="text/javascript">
function SelectallColorsForStyle(e,val) {
var IDValue = $(e).attr('id');

var StyleNumber = document.getElementById(IDValue).value;
alert(StyleNumber);
}
</script>

Showing value as "ON" rather than the original value displaying aside of checkbox.