How to get textarea's cursor move to the end of the highlighted text on drag and drop?

When I drag and drop the image into the textarea, the text is highlighted.
Is there a way to have the textarea's cursor move to the end of the highlighted text?

<style>

img {
  width: 100px;
}

</style>

<div class="emote">
<img src="https://images.duckduckgo.com/iu/?u=http%3A%2F%2Ficons.iconarchive.com%2Ficons%2Fpaomedia%2Fsmall-n-flat%2F512%2Fcat-icon.png&f=1" alt="emote1" title="emote1" class="emoteImage">
</div>


<textarea></textarea>

<script>

document.querySelectorAll('.emoteImage').forEach((emoteImage) => {
  emoteImage.addEventListener('dragstart', (event) => {
    event.dataTransfer.setData('text', emoteImage.alt);
    event.effectAllowed = "copy";
  });
});

</script>