As suggested by @Musa use <label />
instead of <span />
<label />
has for
attribute to target specific input field. So clicking on the label will focus the input element.
Note: The input <input id="label-check" />
id value must be same as label <label for="label-check">
for value.
HTML:
<label for="label-check">
<input type="checkbox" id="label-check" style="vertical-align: middle;"/> Nie pytaj więcej...
</label>
JS:
$('#S8l2560g').find('input').css('cursor', 'pointer').change(function(e) {
if ($(this).is(':checked')) {
$('#k5ORgvNM span').text('yes, is checked').css('color', 'red');
$(this).prop('checked', true);
}
else {
$('#k5ORgvNM span').text('no, is nonchecked').css('color', 'blue');
$(this).prop('checked', false);
}
});
CSS:
label {
cursor: pointer;
}