CSS：从AJAX加载的span后，空类仍然适用

Question

我在通过jQuery :empty加载的范围上使用$.post()。

在填充范围时，在Internet Explorer 11中，:empty CSS定义仍应用于范围。当我点击页面正文中的任意位置时，:empty定义将被删除，页面的样式将应该如此。

它似乎在Chrome中按预期工作。

在jQuery调用完成时，javascript / jQuery中有没有办法强制IE从span中删除:empty伪类？

以下是有问题的CSS定义;

#widgetContainer span[id^="wdg_"]:empty, .widget_placeholder:empty {
    background-color: #ccc;
    border: 5px dashed #999;
    border-radius: 0px;
    width: 300px;
    line-height: 300px;
    text-align: center;
}

这是我运行的javascript函数来加载“小部件” 注意：我正在使用ASP.NET MVC，这就是为什么load函数第一个参数看起来有点时髦

function loadWidget(id) {
    var $wdgt = $("<span id='wdg_" + id + "'>");
    $wdgt.appendTo($("#widgetContainer"));
    $wdgt.load('@Url.Action("GetWidget", "Dashboard")', { widgetID: id }, function (data) {
        var init = window["initWidget" + $(this).find("#widgetID").val()];
        if (typeof init === 'function') {
            init();
        }
        $("#widgetContainer").sortable("refresh");
    });
}