javascript - 親がチェックされているときに、すべての子チェックボックスをチェックしようとしています。しかし、これは一度しか機能しません! 次にやってみると、子供はチェックされませんか？

Question

$(document).ready(function (e) {
    $('.links > input').change(function () {
        if ($(this).is(':checked')) {
            $(this).parent().children('.subLinks').children('.subLinkCheck').children().attr('checked', true);
        } else 
          $(this).parent().children('.subLinks').children('.subLinkCheck').children().attr('checked', false);;
    });
});

初めてでも問題なく動作します。子のチェックボックスをオフにしてから親のチェックボックスをクリックすると、失敗します。

これはHTMLコンテンツです

<ul id="mainLink">
    <li class="links">
        <input type="checkbox" />Interactive Community
        <ul class="subLinks">
            <li class="subLinkCheck">
                <input class="1" type="checkbox" />Usability Testing</li>
            <li class="subLinkCheck">
                <input type="checkbox" />HFI Certification</li>
        </ul>
    </li>
    <li class="links">
        <input type="checkbox" />Heuristic Evaluations
        <ul class="subLinks">
            <li class="subLinkCheck">
                <input type="checkbox" />Usability Testing</li>
            <li class="subLinkCheck">
                <input type="checkbox" />HFI Certification</li>
        </ul>
    </li>
</ul>