Textarea tags

Insert a new text or a input value into a textarea at the cursor position using jquery

HTML

<form>
    <textarea id="text1" cols="40" rows="3"></textarea>
    <textarea id="text2" cols="40" rows="3"></textarea>
    <textarea id="text3" cols="40" rows="3"></textarea>
    <textarea id="text4" cols="40" rows="3"></textarea>
    <br>
    <input type="button" value="one" />
    <input type="button" value="two" />
    <input type="button" value="three" />
</form>

JavaScript

let currentInput = $('#text1');
$(document).on('focus', 'textarea', function() {
	currentInput = $(this);
})

$( 'input[type=button]' ).on('click', function(){
  let cursorPos = currentInput.prop('selectionStart');
  let v = currentInput.val();
  let textBefore = v.substring(0,  cursorPos );
  let textAfter  = v.substring( cursorPos, v.length );
  currentInput.val( textBefore+ $(this).val() +textAfter );
});