सभी का चयन के साथ चेकबॉक्स गिनती

मुझे सभी विकल्पों का चयन करने के साथ चेकबॉक्स गिनती बनानी है, यह तब काम करता है जब प्रत्येक चेकबॉक्स मैं गिनती का चयन करता हूं, लेकिन जब सभी विकल्प चुनते हैं तो यह काम नहीं कर रहा है, मैं एएसपी.नेट एमवीसी में कार्यान्वित कर रहा हूं, यहां मेरा कोड है जावास्क्रिप्ट

var countChecked = function () {
        var n = $('input[name="DocNames"]:checked').length;
        $("#span").text(n + (n === 1 ? " document is" : " documents are") + " checked!");
    };
    countChecked();
    $('input[name="DocNames"]').on("click", countChecked);

    $('#select_all').click(function (e) {
        $(this).closest('table').find('td input[name="DocNames"]').prop('checked', this.checked);
    })

एचटीएमएल कोड

<table class="table">
<tr>
    <th>Documnet Name</th>
</tr>
<tr>
    <td><label><input type="checkbox" name="select_all" id="select_all" />Select All</label></td>
</tr>
@if (Model.Documents != null)
{
    foreach (var item in Model.Documents)
    {
        <tr>
            <td>
                <label>
                    <input type="checkbox" name="DocNames" value="@item.DocumentName.Trim()" />
                    @item.DocumentName.Trim()
                </label>
            </td>
        </tr>
    }
}
else
{

    <tr>
        <td>@ViewBag.NoDocuments</td>
    </tr>
}

<div id="span"></div>