Jquery Switchery checkbox disable created new checkbox on page

i struggle to disable the Switchery checkbox but it creates me another Switchery checkbox on page . i first define the checkbox which is working great:

<div class="form-group">
    <label class="col-md-2">
        Additional Options
    </label>
    <div class="col-md-3">
        <div class="">
            <label>
                <input type="checkbox" id="foo1"
                       name="foo1" class="js-switch"/>
            </label>
        </div>
    </div>
</div>

now after the page loaded, i dynamically want to disable the checkbox so I do :

var foo1=  document.getElementById('foo1')
var switchery = new Switchery(foo1);
switchery.disable();

it disable the checkbox BUT it creates me new checkbox near the one i defined already i don't understand why