How Can I know the exact paragraph where delete key was down?

Let's say we have a html like below.

<div class="my_content" contenteditable="true">
    <div class="my_paragraph"><span style="color:red;">RED</span><span style="color:green;">GREEN</span></div>
    <div class="my_paragraph"><span style="font-size:1em">1EM-TEXT</span><div>
    <div class="my_paragraph"><span style="font-size:2em">2EM-TEXT</span><div>
</div>

And I have a Backbone viewer like below.

 events: {
    "keydown .my_paragraph" :"onKeyDown"
 },

 onKeyDown : function(e) {
     if(e.keyCode === 46) { //delete key
     }
 }

Q. In the 'if' at the onKeyDown Method, How can I get the exact-paragraph which is user try to delete (by press delete key)?

Solution

onKeyDown : function(e) {
     if(e.keyCode === 46) { //delete key
     }
 }

You expect an event to be passed in your example that is the param e You can identify what paragraph is focus using e.target object

Update:

As what have derek said, divs cannot listen to keypress event unless you set content editable to true.

For this to work , remove the contenteditable of parent div and set this property in each of the child

$(function(){
  $('.my_paragraph').on('keydown', function(e){
       console.log(e.target);
  });
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="my_content">
    <div class="my_paragraph first" contenteditable="true"><span style="color:red;">RED</span>"><span style="color:green;">GREEN</span></div>
    <div class="my_paragraph second" contenteditable="true"><span style="font-size:1em">1EM-TEXT</span></div>
    <div class="my_paragraph third" contenteditable="true"><span style="font-size:2em">2EM-TEXT</span></div>
</div>