Delete a dropped item by delete key press
<p>I have created a page droppable and am trying to delete the dragged elements. But I have a problem that I don't know how delete the selected elements from the keyboard delete key.
here is my code:</p>

<pre><code>$canvasElement.click(function() {
    jQuery('.canvas-element').removeClass('selectedItem');
    jQuery($canvasElement).addClass('selectedItem');
    jQuery('#button').removeClass('delete');
    jQuery('#button').addClass('showButton');
})

jQuery(".deleteButton").click(function () {
jQuery(".selectedItem").remove();
jQuery('#button').removeClass('showButton');
jQuery('#button').addClass('delete');
});
</code></pre>

<p>HTML:</p>

<pre><code>&lt;li&gt;
    &lt;p id="button" class="delete"&gt;&lt;button class="deleteButton"&gt;Delete&lt;/button&gt;&lt;/p&gt;
&lt;/li&gt;
</code></pre>

<p>CSS:</p>

<pre class="lang-css prettyprint-override"><code>.selectedItem {
    border: 2px solid #5C3B84!important;
}
.showButton {
    display:block!important;
}
.delete {
    display:none;
}
</code></pre>

<p>But I have to delete the element from the keyboard delete key.</p>
