JSFiddle - React, Tailwind, and code Playground

by davidmurdoch

HTML

Using jQuery 1.6.4
<div class="all-checker change-logger">
    <label><input type="checkbox" class="all" value="all"> Check All</label><br/>
    <fieldset>
        <label><input type="checkbox" value="first"> First</label><br/>
        <label><input type="checkbox" value="second"> Second</label><br/>
        <label><input type="checkbox" value="third"> Third</label>
    </fieldset>
</div>

JavaScript

$(".all-checker").delegate(".all", "change", function() {
    $("input").not(this).prop("checked", this.checked).trigger("change");
});

$(".change-logger").delegate("input", "change", function() {
    console.log("Log: " + this.value + " is checked? " + this.checked);
});