Javascript 当文本移动到另一个div时，如何更改文本的颜色

我希望通过改变Dragable元素在drop字段中的颜色，使其更具交互性。但我还没有想到如何用当前的代码做到这一点

这是我的HTML：

<!-- Begin draggable area -->
            <div class="draggable">
                <div class="row">
                    <div class="col-md-12">
                        <h2 class="window-title">Spectra</h2>
                    </div>
                </div>
                <div class="row">
                    <div class="draggable-spectra">   <!--draggable element-->
                      <h3>Menu</h3>
                      <p class= "element">dasdsa</p>
                    </div>
                    <div class="draggable-spectra"><h3>Content</h3></div>  <!--draggable element-->
                </div>
             </div>
<!-- End draggable -->

            <!-- Begin Drop Area -->
            <div class="droppable-spectra">
                <h2 id="drop">Drop-box</h2>
            </div>
            <!-- end Drop Area -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <script src="assets/js/drag.js"></script>  <!--js file where I have the code below-->

现在它是这样工作的（这是aSeptik的一个例子）：

但是，当可拖动框放置在可拖放框中时，如何更改可拖动框中的文本颜色？我已经尝试了.data（），但它不起作用。如有任何建议，将不胜感激。谢谢

$('#element').droppable({
    drop: callback,
    greedy: true
});

我认为你需要实现这样的东西

---

您可以使用可拖放小部件的事件回调，如下所示：

$（“.draggable光谱”）.draggable（）；
$（“.droppable spectrum”）.droppable({
drop：函数（e、ui）{
css（'color'，'blue'）；
}
});

光谱
菜单
dasdsa
内容
投递箱
在完成拖动时，您可能需要实现回调，不是吗？在
返回后有
if
块，因此永远无法到达它。但是为什么你认为
.data（“color”，“blue”）
会改变文本的颜色？你能添加足够的代码让我们重现你的问题吗？
的评论对我们毫无用处。请提供完整的答案。@David Thomas，我很抱歉。我是JS的新手，也是这个网站的新手。我想现在代码已经足够重现这个问题了。非常感谢！我对这一点还不熟悉，我知道现在做这件事对我来说可能是一种进步。但是如果我只是想用“element”类改变元素的颜色，我应该怎么做？我试着做“$（“.element”）.ui.draggable.css（'color'、'blue'）”，但它不起作用。还有，关于如何在还原时恢复颜色的任何提示？@kabele您应该执行
ui.draggable.find（'.element'）.css（'color'，'blue'）。要恢复颜色，可以使用callback@TJ，你救了我一天！我使用“stop”的问题是，当我在droppable（）中添加代码“stop:function（event，ui）{ui.draggable.find（'.element'）.css（'color'，'black'）；}”时，元素无法被拖动。我想我一定把它放错地方了吧？或者我应该返回一个值？@KabeLee stop是一个可拖动的事件，而不是droppable@TJ，对不起。我打错了。我确实在draggable中使用了stop，但是在我这样做之后，元素就不能移动了。代码如下：
$（“.draggable spectrum”）.draggable（{revert:function（event，ui）{$（this.data（“uiDraggable”）.originalPosition={top:0，left:0}；return！event；}stop:function（event，ui）{ui.draggable.find（'.element'）.css（'color'，'black'）；}}）；
$('#element').droppable({
    drop: callback,
    greedy: true
});