Check for Checked or unchecked a checkbox

For Example, Check for Checked or unchecked a checkbox...

Demo

HTML

<p>Choose a colors:</p>
<label><input type="checkbox">Red</label>
<label><input type="checkbox">Green</label>
<label><input type="checkbox">Blue</label>
<p id="check-status">Please checkbox click...</p>

CSS

<style>
    label { 
        display: block; 
        margin-bottom: 10px; 
        -webkit-user-select: none; 
        -moz-user-select: none; 
        -ms-user-select: none; 
        user-select: none; 
    }
    #check-status { 
        color: #333333; 
        border: 1px solid #CCC; 
        padding:8px 10px; 
    }
</style>

Javascript

$(function(){
    $('label').click(function() {
        var color = $(this).text();
        
        if ($(this).children().is(':checked')) {
            $('#check-status').html('You checked <strong>' + color + '</strong> Checkbox.');
        } else {
            $('#check-status').html('You unchecked the <strong>' + color + '</strong> Checkbox.');
        }
    });
})