CSS不适用于通过Javascript新添加的元素

Question

我要在按钮单击页面上添加一个新的<div>。问题在于样式不适用于新的div，不适用于新的div，主要是内部div，这是我需要的地方。我已经看过一些问题，并尝试使用转义字符，但似乎没有任何效果。

如果页面加载时div存在，则样式有效。

添加div的JavaScript：

AddNewSection: function () {
    var me = IndexController;        
    $("#addNew").before('<div id="New' + me.options.count + '" class="block center">\
                            <div style="width:100%;flex:1;display:inline-flex" >\
                                <div class="group">\
                                    <input id="Question' + me.options.count + '" type="text" class="inputHighlight">\
                                    <span class="bar"></span>\
                                    <label class="labelHighlight">Question</label>\
                                </div>\
                                <div class="group">\
                                    <label>Type</label>\
                                </div>\
                                <div class="group">\
                                    <input id="Drop'+ me.options.count + '" value="1" />\
                                </div>\
                            </div>\
                            <div id="TypeDiv'+ me.options.count + '">\
                            </div>\
                        </div>');
    me.CreateDropDown(me.options.count);
    me.options.count++;
},

在页面上硬编码的div：

<div id="New1" class="block center">
<div style="width:100%;flex:1;display:inline-flex">
    <div class="group">
        <input id="Question1" type="text" class="inputHighlight" required>
        <span class="bar"></span>
        <label class="labelHighlight">Question</label>
    </div>
    <div class="group">
        <label>Type</label>
    </div>
    <div class="group">
        <input id="Drop1" value="1" />
    </div>
</div>
<div id="TypeDiv1">
</div>

CSS

<style>
p {
    margin: 10px;
}

body {
    background: white;
    min-height: 100%;
}

#Page {
    position: relative;
    padding: 5px 10px;
    background-color: whitesmoke;
    margin: 60px auto;
    font: normal 12px/21px sans-serif;
    color: #444;
}

    #Page.wide {
        width: 70%;
    }

    #Page.narrow {
        width: 30%;
    }

    #Page:before, #Page:after {
        content: '';
        position: absolute;
        left: 0;
        box-shadow: 0 0 10px black;
        border-radius: 50%;
        width: 100%;
        height: 20px;
        display: none;
    }

    #Page.top-shadow:before {
        display: block;
        top: 0px;
        clip: rect(-40px auto 0 auto);
    }

    #Page.bottom-shadow:after {
        display: block;
        bottom: 0px;
        clip: rect(20px auto 40px auto);
    }

.AddNew {
    width: 90%;
    height: 100px;
    border: thin solid #ddd;
    flex: 1;
    text-align: center;
}

.center {
    margin: 15px auto 15px;
    padding: 10px;
}

.block {
    width: 90%;
    height: 150px;
    border: thin solid #ddd;
    flex: 1;
    text-align: center;
}

    .block.center {
        margin: 15px auto 15px;
        padding: 10px;
    }

.group {
    position: relative;
    margin-bottom: 45px;
}

.inputHighlight {
    font-size: 18px;
    padding: 10px 10px 5px 5px;
    display: block;
    width: 300px;
    border: none;
    border-bottom: 1px solid #757575;
}

    .inputHighlight:focus {
        outline: none;
    }

/* LABEL ======================================= */
.labelHighlight {
    color: #999;
    font-size: 18px;
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    left: 5px;
    top: 10px;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}

/* active state */
.inputHighlight:focus ~ .labelHighlight, .inputHighlight:valid ~ .labelHighlight {
    top: -10px;
    font-size: 14px;
    color: #5264AE;
}

/* BOTTOM BARS ================================= */
.bar {
    position: relative;
    display: block;
    width: 300px;
}

    .bar:before, .bar:after {
        content: '';
        height: 2px;
        width: 0;
        bottom: 1px;
        position: absolute;
        background: #5264AE;
        transition: 0.2s ease all;
        -moz-transition: 0.2s ease all;
        -webkit-transition: 0.2s ease all;
    }

    .bar:before {
        left: 50%;
    }

    .bar:after {
        right: 50%;
    }

/* active state */
.inputHighlight:focus ~ .bar:before, .inputHighlight:focus ~ .bar:after {
    width: 50%;
}

输出：

让我知道您是否还需要其他东西。

谢谢你。