JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="myTextarea"></textarea>

JavaScript

const myTextarea = document.querySelector('#myTextarea');

myTextarea.addEventListener('keydown', (event) => {

		const cursorPos = myTextarea.selectionStart;
		const text = myTextarea.value;
		const textBeforeCursor = text.substring(0, cursorPos);
		const textAfterCursor = text.substring(cursorPos);
    
		if (textBeforeCursor.endsWith('<kbd') && event.key === '>') {
      event.preventDefault();
			myTextarea.value = textBeforeCursor + '></kbd>' + textAfterCursor;
			myTextarea.selectionStart = cursorPos + 1;
			myTextarea.selectionEnd = cursorPos + 1;
		}
});