jquery disable checkbox by default
<p>My current script is toggling between disabled and enabled.</p>

<pre><code>&lt;script&gt;
    $("#filter").attr('checked', !$("#mylist")[0].disabled);
    $("#filter").click(function() {
        $("#mylist").attr('disabled', !this.checked)
    });
&lt;/script&gt;
</code></pre>

<p>and my html code is:</p>

<pre><code>&lt;div&gt;
    &lt;div class="checkbox"&gt;
        &lt;input type="checkbox" checked="checked" id="filter" /&gt;
        &lt;label for="filter"&gt;Types&lt;/label&gt;
        &lt;br&gt;
    &lt;/div&gt;
    &lt;select class="selectpicker" id="mylist" multiple&gt;
        &lt;option&gt;A&lt;/option&gt;
        &lt;option&gt;B&lt;/option&gt;
        &lt;option&gt;C&lt;/option&gt;
    &lt;/select&gt;
&lt;/div&gt;
</code></pre>

<p>by default the checkbox is checked, and when I remove the `checked="checked" , it doesn't work at all.<br/>
How can I disable this by default and only enable/disable it afterwards?</p>