Не работает JS в любых браузерах

Вот весь код https://codepen.io/croix324/pen/Baaovxx почему-то не работает при клике на кнопку. Хотя весь код брал с другого сайта и там все отлично работает.

<div id="dd" class="wrapper-dropdown-4">Сделать
<ul class="dropdown">
    <li><input type="checkbox" id="el-1" name="el-1" value="donut"><label for="el-1">Съесть пирожок</label></li>
    <li><input type="checkbox" id="el-2" name="el-2" value="neighbour"><label for="el-2">Следить за соседями</label></li>
    <li><input type="checkbox" id="el-3" name="el-3" value="T-rex"><label for="el-3">Покормить кота</label></li>
</ul>
</div>
function DropDown(el) {
this.dd = el;
this.opts = this.dd.find('ul.dropdown > li');
this.val = [];
this.index = [];
this.initEvents();
}
DropDown.prototype = {
initEvents : function() {
    var obj = this;
    obj.dd.on('click', function(event){
        $(this).toggleClass('active');
        event.stopPropagation();
    });
    obj.opts.children('label').on('click',function(event){
        var opt = $(this).parent(),
            chbox = opt.children('input'),
            val = chbox.val(),
            idx = opt.index();
        ($.inArray(val, obj.val) !== -1) ? obj.val.splice( $.inArray(val, obj.val), 1 ) : obj.val.push( val );
        ($.inArray(idx, obj.index) !== -1) ? obj.index.splice( $.inArray(idx, obj.index), 1 ) : obj.index.push( idx );
    });
},
getValue : function() {
    return this.val;
},
getIndex : function() {
    return this.index;
}
}