JSFiddle - React, Tailwind, and code Playground

HTML

<div id="x">
  Contrary to popular belief Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.
</div>

CSS

#x {
  width:200px;
}

span {
  color: red;
}

JavaScript

function fn(el) {
  var range;
  var textNode;
  var offset;

  var e = {};

  var height = el.clientHeight;
  var lh = parseFloat(getComputedStyle(el).lineHeight, 10) || 18;
  var D = height / lh;
  var secondLastLineStart = (D - 1.5) * lh;
  var pos = el.getBoundingClientRect();
  e.x = pos.right;
  e.y = secondLastLineStart;

  if (document.caretPositionFromPoint) {
    range = document.caretPositionFromPoint(e.x, e.y);
    textNode = range.offsetNode;
    offset = range.offset;
  } else if (document.caretRangeFromPoint) {
    range = document.caretRangeFromPoint(e.x, e.y);
    textNode = range.startContainer;
    offset = range.startOffset;
  }
  var lineContent = el.textContent.slice(offset);
  var repl = textNode.splitText(offset);
  var newEl = document.createElement('span');
  textNode.parentNode.replaceChild(newEl, repl);
  newEl.appendChild(repl);
}

fn(document.getElementById('x'));