JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content">
   <span class="pivot">1</span>
   I know this is a really simple
   <span class="pivot">2</span>
   question
   <span class="pivot">3</span>
   to answer 
   <span class="pivot">4</span>
   please 
   <span class="pivot">5</span>
   help me to solve.
</div>
<input type="button" value="get it!" id="your_button">

JavaScript

function getSelectionText() {
    var text = "";
    if (window.getSelection) {
        text = window.getSelection().toString();
    } else if (document.selection && document.selection.type != "Control") {
        text = document.selection.createRange().text;
    }
    return text;
}



$('#your_button').click(function() {
   var whole_text = $('#content').text();
   var selected_text = getSelectionText();
   var index_of = whole_text.indexOf(selected_text);
   var end_of = index_of + selected_text.length;
    alert('index_of: ' + index_of + ' end_of: ' + end_of);
});