JSFiddle - React, Tailwind, and code Playground

HTML

<div class="conttext">How hard can it be to achieve this here and now. Will it be difficult or can it be done with great simplicity</div>

<a href="javascript:void(0);" class="format bold">test</a>

CSS

.highlight {
    color:#888;
}

JavaScript

$(document).ready(function(){
    $(".format").click(function(){
       var highlight = window.getSelection();
       
        var spn = '<span class="highlight">' + highlight + '</span>';
        $('.conttext').html($('.conttext').html().replace(highlight, spn));   
    });
});