JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="metadata-entry" id="a667u1145"><span class="generated" id="h279i25">Title: </span>BMC Bioinformatics</p>
<button class="button"> Click </button>

CSS

.annotation{background-color:yellow;}

JavaScript

$(document).ready(function() {
    $('.button').click( function(e) {
        var element = document.getElementById("a667u1145");
        var start = 7;
        var end = 26;
        var totalText = element.textContent;
        var toFindText = totalText.substring(start,end);
        var toReplaceText = "<span class='annotation'>"+toFindText+"</span>";
        //alert("totalText = '"+totalText+"' \n toFindText = '"+toFindText+"' \n toReplaceText = '"+toReplaceText+" \n");
        element.innerHTML = element.innerHTML.replace(toFindText, toReplaceText);
    });
});