Javascript 在Dynamics 365嵌入式iframe web资源中使用加载微调器

我试图在Dynamics 365应用程序的嵌入式iframe中使用加载微调器。我正在使用此库：。我可以看到CSS加载正确，因为当button/div元素上运行一个类时，它会显示旋转图标

我试图做的是在单击按钮时将“running”类添加到按钮中，这样用户就知道某个操作正在发生，并且他们应该期望在不久的将来发生一些事情。但是，当我有代码将“running”类添加到按钮时，它似乎不起作用。这是我的密码：

$("#retakeButton").on("click", function () {
    $("#retakeButton").addClass('running');
    \\\\\\ LOGIC GOES HERE \\\\\\
    $("#retakeButton").removeClass('running');
});

这是我的HTML：

    <div id="outerBorder" class="container embed-responsive ">
        <div class="col-md-12" id="topbuttons">
            <div class="btn-group btn-group-justified">
                <div class="btn-group">
                    <div type="button" id="retakeButton" class="btn btn-primary hovering ld-over">
                        <strong>Take Photo</strong>
                        <div class="ld ld-ring ld-spin-fast"></div>
                    </div>
                </div>
            </div>
        </div>
        <div id="carousel" class="slideshow-container"></div>
        <br>
        <div id="dots" style="text-align:center"></div>
    </div>

拍照

---

奇怪的是，如果我打开控制台并选择iframe作为目标，我可以通过运行

$（“#retakeButton”）.addClass（'running'），让它显示正在进行的动画。但是，它在HTML引用的javascript中似乎不起作用。
我刚刚测试了这个，它起作用了

为了清晰可见，我为
div
添加了一个边框，还为测试注释了
removeClass
（它可能太快而无法注意到）


$（“#div_loader”）。在（“单击”，函数（）{
$（“#div_loader”）.addClass（'running'）；
//做些逻辑分析
//$（“#retakeButton”）.removeClass（'running'）；
});

最后一件事。问题可能是由类
悬停造成的-您可以删除并测试代码

<div id="div_loader" class="btn btn-default ld-ext-top" style="border:solid; font-size:2em">
    <div class="ld ld-ring ld-spin-fast"></div>
</div>

$("#div_loader").on("click", function () {
    $("#div_loader").addClass('running');
      //do some logic
    //$("#retakeButton").removeClass('running');
});