jQueryui Draggable item class

Question

So i want to use jQueryui and its draggable/droppable combo, and when I drop an item into certain container i want to add a class to THAT item I've dragged. Is that possible? So far what I've managed to do is to add a class to the container I've dropped the draggable item to. but that's not what I want.

Here is the pen I'm working on at the moment: http://codepen.io/zmuci/pen/Rrbvgg

<div class="categories">
  <div class="categorie">first categorie</div>
  <div class="categorie">second categorie</div>
  <div class="categorie">third categorie</div>
  <div class="categorie">forth categorie</div>
  <div class="categorie">fifth categorie</div>
  <div class="categorie">sixth categorie</div>
  <div class="categorie">seventh categorie</div>
</div>

<div class="grid">
  <div class="grid-item grid-item-1">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-2">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-3">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-4">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-5">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-6">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-7">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-8">
    <div class="grid-item-inner"></div>
  </div>
  <div class="grid-item grid-item-9">
    <div class="grid-item-inner"></div>
  </div>
</div>

Answer 1

in drop function use this.

$(ui.draggable).addClass('newClass')