Javascript Jquery insertBefore插入文本而非HTML

在将新的HTML插入DOM之前，将显示insert中的示例

我的HTML的结构如下：

        <div class="left line">
            <div class="steps" id="step1"></div>
        </div>
        <div class="left line">
            <div class="steps" id="step2"></div>
        </div>

我在文档准备就绪后调用此函数（注意，我尝试将文本同时包装为“”和“”，并得到相同的结果。代码正在for循环中运行，并且插入到正确的位置

        if (opts[i].payments1) {
            console.log("P1")
            $( "< div class = 'payment1'> < /div>" ).insertBefore( "#step" + i );

        }

if（选择[i].payments1）{
控制台日志（“P1”）
$（“
”）.insertBefore（“#step”+i）；
}

当我运行代码时，我得到了这个

<div class="left line">
   &lt; div class = 'payment1'&gt; &lt; /div&gt;
  <div class="steps" id="step1" style="background-color: blue;"></div>
</div>

div class='payment1'/div

因此，当我查看页面时

---

我假设

jQuery
不喜欢你写
的方式，而不是div的格式。addClass（“payment1”）。insertBefore（$（“#step”+I））；
$（“”）addClass（“payment1”）.insertBefore（$（“#步骤”+i））；
不要在html
中添加空格，不要在html
中添加空格，就是这样。当我早些时候使用Sublime时，我告诉它为我设置JavaScript间距和缩进格式，因为html正好位于底部以容纳它，它添加了空格，所以我没有注意到。谢谢，就是这样。当我使用Sublime earl时我告诉它为我设置JavaScript间距和缩进的格式，当我把HTML放在底部时，它增加了空格，所以我没有注意到。谢谢
 $( "<div class='payment1'> </div>" ).insertBefore( $("#step" + i) );

$("<div>").addClass("payment1").insertBefore( $("#step" + i) );