jquery实现下拉多选框

最近公司有个老项目需要加一些新功能，老项目是用jquery开发的，现在要做一个下拉多选框，找了很多原生的UI插件都没有下拉多选框或者就是原生需要加ctrl才可以多选，这里用 ul li 做的下拉多选框下面放代码：
html代码：

<div class="divBox">
　　　　<div class="duiMutiple">
　　　　　　<div class="divSel">多选选择</div>
　　　　　　<ul id="usertype">
              <li value="1">吃饭</li>
　　　　　　　　<li value="2">睡觉</li>
　　　　　　　　<li value="3">玩手机</li>
　　　　　　</ul>
　　　　</div>
　　</div>

javaScript代码（记得引入jquery.js文件）

let setValList = [],setLabelList = [];
        //select多选
        $("#usertype").hide();
        $(".divSel").click(function() {
            $("#usertype").toggle();
        });
        $('#usertype li').click(function () {
            if(setValList.indexOf($(this).val()) === -1){
                setValList.push($(this).val());
                setLabelList.push($(this).text());
                $(this).addClass('optionSelStyle');
            }else {
                let index = setValList.indexOf($(this).val());
                setValList.splice(index,1);
                setLabelList.splice(index,1);
                $(this).removeClass('optionSelStyle');
            }
            console.log(setLabelList) //选择的多选框中的数据
            $('.divSel').html(setLabelList.join(' '));
        })

css代码：

.duiMutiple{
      width: 120px;
      height: 24px;
      position: relative;
      margin-top: 7px;
      display: block;
      .divSel{
        width: 93px;
        height: 24px;
        line-height: 24px;
        padding-left: 10px;
        cursor: pointer;
        background: #fff;
        border: 1px solid #95b7e7;
        position: absolute;
        top: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      #usertype{
        width:120px;
        max-height:200px;
        border-radius:5px;
        background: #fff;
        border:1px solid #95b7e7;
        overflow: auto;
        margin-top: -20px;
        display: none;
        z-index: 99999!important;
        position: absolute;
        top: 48px;
        li{
          width: 90px;
          height: 30px;
          line-height: 30px;
          padding: 0 5px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          float: left;
        }
      }
      .optionSelStyle{
        background: #3188E1;
        color: #fff;
      }
    }