JSFiddle - React, Tailwind, and code Playground

by pradeep

HTML

<textarea>
Choose one link in the options... and select some text to create an anchor tag - hyperlink
</textarea>

<div>
    User inputs link here:
    <input type="text" id="user_link" value="https://google.com/" />
</div>

CSS

textarea {
    height: 100px;
    width: 250px;
}
textarea, a, div {
    display: block;
    margin: 20px;
}

JavaScript

$("textarea").on("select", function(){
    var start = this.selectionStart;
    var end = this.selectionEnd;
    
    var text = this.innerHTML.substring(start, end);
    var link = $("#user_link").val();
    
    var new_link ="<a href='"+link+"' target='_blank'>"+text+"</a>";

});