jQuery实现点击选择框和选择按钮以外的地方 隐藏选择框

html:

<div class="calculator-condition">
                    <p class="sub-title">计算条件</p>
                    <div class="select-item">
                        <label class="select-label fl">选择户型</label>
                        <div class="select-content fl">
                            <div class="select-text">
                                <span></span>
                                <input type="text" name="" id="" value="" hidden>
                                <i></i>
                            </div>
                            <ul class="select-list">
                                <li>3室2厅1卫 约101m²</li>
                                <li>3室2厅2卫 约111m²</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select-item">
                        <label class="select-label fl">估算总价</label>
                        <div class="select-content fl">
                            <div class="fixed-text">
                                <span class="price">52</span>
                                <span class="text-color">万元</span>
                                <span class="desc">（均价5100元/m² × 面积101m²）</span>
                                <input type="text" name="" id="" value="" hidden>
                            </div>
                        </div>
                    </div>
                    <div class="select-item">
                        <label class="select-label fl">按揭成数</label>
                        <div class="select-content fl">
                            <div class="select-text">
                                <span>7成</span>
                                <input type="text" name="" id="" value="" hidden>
                                <i></i>
                            </div>
                            <ul class="select-list">
                                <li>1成</li>
                                <li>2成</li>
                                <li>3成</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select-item">
                        <label class="select-label fl">贷款类别</label>
                        <div class="select-content fl">
                            <div class="select-text">
                                <span>商业贷款</span>
                                <input type="text" name="" id="" value="" hidden>
                                <i></i>
                            </div>
                            <ul class="select-list">
                                <li>商业贷款</li>
                                <li>公积金贷款</li>
                                <li>组合贷款</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select-item">
                        <label class="select-label fl">贷款时间</label>
                        <div class="select-content fl">
                            <div class="select-text">
                                <span></span>
                                <input type="text" name="" id="" value="" hidden>
                                <i></i>
                            </div>
                            <ul class="select-list">
                                <li>1年（期）</li>
                                <li>2年（期）</li>
                                <li>3年（期）</li>
                                <li>4年（期）</li>
                                <li>5年（期）</li>
                                <li>6年（期）</li>
                                <li>7年（期）</li>
                                <li>8年（期）</li>
                                <li>9年（期）</li>
                            </ul>
                        </div>
                    </div>
                </div>

js:

$(document).ready(function () {
    $(document).click(function (event) {
        let $target = $(event.target).parents('.select-content');
        let allSelectList = $('.calculator-condition .select-list');
        if ($target.length === 1) {
            let $targetChild = $target.children('.select-list');
            if ($targetChild.is(':visible')) {
                $targetChild.hide();
            } else {
                allSelectList.hide();
                $targetChild.show();
            }
        } else {
            allSelectList.hide();
        }
    });
});