親にチェックするだけで、子や孫のチェックボックスもまとめてチェック出来る

Result

http://jsfiddle.net/kachibito/NfxSu/3/embedded/result,js,css,html

jQuery

//チェンジイベント
$("ul input:checkbox").change(function(){
    if ($(this).is(':checked')) {
        $(this).parent().find("input:checkbox").attr('checked', 'checked');
    }
    else {
 
        $(this).parent().find("input:checkbox").removeAttr('checked');
        $(this).parents('li').each(function(){
            $(this).children('input:checkbox').removeAttr('checked');
        });
    }
});

html

<ul>
<li><input type="checkbox" id="input1"><label for="input1">check 1</label>
    <ul>
    <li><input type="checkbox" id="input11"><label for="input11">check 11</label></li>
    <li><input type="checkbox" id="input12"><label for="input12">check 12</label></li>
    <li><input type="checkbox" id="input13"><label for="input13">check 13</label></li>
    </ul>
</li>
<li><input type="checkbox" id="input2"><label for="input2">check 2</label></li>
<li><input type="checkbox" id="input3"><label for="input3">check 3</label>
<ul>
    <li><input type="checkbox" id="input31"><label for="input31">check 31</label></li>
    <li><input type="checkbox" id="input32"><label for="input32">check 32</label></li>
    <li><input type="checkbox" id="input33"><label for="input33">check 33</label>
            <ul>
            <li><input type="checkbox" id="input331"><label for="input331">check 331</label></li>
            <li><input type="checkbox" id="input332"><label for="input332">check 332</label></li>
            <li><input type="checkbox" id="input333"><label for="input333">check 333</label></li>
            </ul>
    </li>
</ul>
</li>
</ul>