Check or uncheck all enabled checkboxes

I am trying to toggle all enabled checkboxes when click on '#leg-chkAll', but I am missing something!

If possible put some comment explaining the javascript code.

$(document).ready(function(){
  $('#leg-chkAll).on('click', function () {
                $('div#legend').find('div :checkbox:enabled')                                   
                        .prop('checked', this.checked)
                        .find('tbody :checkbox').toggleClass('selected', this.checked);

        });
});

<div id="leg-chkAll">
    <input type="checkbox">
    <span class="leg-des">All</span>
</div>
<div id="legend">
    <div id="leg-evt1">
        <input type="checkbox" class="leg-chk" checked>
        <span class="leg-cod ev-event1">E1</span>
        <span class="leg-des">Event1</span>
        <span class="leg-day">1</span>
    </div>
    <div id="leg-evt2">
        <input type="checkbox" class="leg-chk" checked>
        <span class="leg-cod ev-event2">E2</span>
        <span class="leg-des">Event2</span>
        <span class="leg-day">10</span>
    </div>
    <div id="leg-evt3">
        <input type="checkbox" class="leg-chk" checked>
        <span class="leg-cod ev-event3">E3</span>
        <span class="leg-des">Event3</span>
        <span class="leg-day">3</span>
    </div>
    <div id="leg-evt4">
        <input type="checkbox" class="leg-chk" disabled>
        <span class="leg-cod ev-event4">E4</span>
        <span class="leg-des">Event4</span>
        <span class="leg-day">0</span>
    </div>
    <div id="leg-evt5">
        <input type="checkbox" class="leg-chk" checked>
        <span class="leg-cod ev-event5">E5</span>
        <span class="leg-des">Event5</span>
        <span class="leg-day">6</span>
    </div>
 </div>

Regards, Elio Fernandes