JSFiddle - React, Tailwind, and code Playground

by Kishore Sahasranaman

HTML

<p class="clickable">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris rutrum ante nunc. Proin sit amet sem purus. Aliquam malesuada egestas metus, vel ornare purus sollicitudin at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer porta turpis ut mi pharetra rhoncus. Ut accumsan, leo quis hendrerit luctus, purus nunc suscipit libero, sit amet lacinia turpis neque gravida sapien. Nulla facilisis neque sit amet lacus ornare consectetur non ac massa. In purus quam, imperdiet eget tempor eu, consectetur eget turpis. Curabitur mauris neque, venenatis a sollicitudin consectetur, hendrerit in arcu.

Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras iaculis, est eu pulvinar suscipit, nisl neque commodo dui, eu bibendum velit leo vel tortor. Nulla eget mauris et libero gravida malesuada. Sed at massa gravida diam rhoncus condimentum. Duis nulla turpis, faucibus vel luctus et, gravida condimentum ante. Integer tincidunt lacus in ante pharetra vitae auctor ipsum malesuada. Phasellus nunc mauris, ultrices quis ultrices a, ultricies fermentum eros. Curabitur non diam et tellus bibendum pellentesque ac vel eros. Nullam varius turpis non est viverra viverra. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur, tortor eget viverra laoreet, eros ante lobortis massa, eu molestie nisl mi non urna. Fusce vehicula tincidunt porta. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce ac arcu faucibus tellus eleifend blandit. Donec quis massa odio, in hendrerit lacus. Proin a dolor massa.

Aenean urna nunc, mattis vel euismod sit amet, accumsan quis elit. Fusce sit amet odio diam. Curabitur ipsum enim, eleifend et aliquam non, laoreet ac est. Maecenas cursus mauris eu sapien consequat consequat. Curabitur commodo euismod arcu non condimentum. Proin quis libero vitae arcu pretium porttitor. Ut sapien tellus, fermentum sit amet scelerisque...

JavaScript

$(".clickable").click(function(e){
         s = window.getSelection();
         var range = s.getRangeAt(0);
         var node = s.anchorNode;
         while(range.toString().indexOf(' ') != 0) {                 
            range.setStart(node,(range.startOffset -1));
         }
         range.setStart(node, range.startOffset +1);
         do{
           range.setEnd(node,range.endOffset + 1);

        }while(range.toString().indexOf(' ') == -1 && range.toString().trim() != '');
        var str = range.toString().trim();
        alert(str);
       });