How to get the text of dragged item in javascript

function onDrag(ev) {
  console.log('You are dragging', ev.target.className)
}

function onDrop(ev) {
  ev.preventDefault();
  var ul =  ev.target;
  var li = document.createElement('li');
  li.appendChild(document.createTextNode("Text?"));
  ul.parentElement.appendChild(li);

}

function onOverDrop(ev) {
  ev.preventDefault();
}

ul, li{border:1px solid green}

.container-left, .container-right {width:45%; margin-left:1%; float:left}

<div class="container-left">
  <ul>
    <li class="A" 
        draggable="true" 
        ondragstart="onDrag(event)">A</li>
    
    <li class="B"  
        draggable="true" 
        ondragstart="onDrag(event)">B</li>
    
    <li  class="C"  
        draggable="true"
        ondragstart="onDrag(event)">C</li>
    
    <li class="D" 
        draggable="true"
        ondragstart="onDrag(event)">D</li>
  </ul>
</div>


<div class="container-right">
  <ul>
    <li> 1
      <ul ondrop="onDrop(event)" ondragover="onOverDrop(event)">
        <li class="1"></li>
      </ul>
    </li>
    <li> 2
      <ul ondrop="onDrop(event)" ondragover="onOverDrop(event)">
        <li class="2"></li>
      </ul>
    </li>
    <li> 3
      <ul ondrop="onDrop(event)" ondragover="onOverDrop(event)"> 
        <li class="3"></li>
      </ul>
    </li>
    <li> 4
      <ul ondrop="onDrop(event)" ondragover="onOverDrop(event)"> 
        <li class="4"></li>
      </ul>
    </li>
  </ul>
</div>