JSFiddle - React, Tailwind, and code Playground

HTML

<div id="text" contenteditable="true">O </ div>

CSS

.green {
  color: green;
}

JavaScript

var text = document.getElementById('text');


text.onkeyup = function(evt) {
	var counter = this.textContent.split(/(Brasil)/i).length;
 
  if (counter > 1 && (!this.lastCount || this.lastCount < counter) ) {
 		this.lastCount = counter;
    this.innerHTML = this.textContent.replace(/(Brasil)/g, "<b class='green'>Brasil</b>&nbsp;");

		var range = document.createRange();
    var sel = window.getSelection();
    var lastNode = text.childNodes.item(text.childNodes.length -1)
    range.setStart(lastNode, 1);
    range.collapse(true);
    sel.removeAllRanges();
    sel.addRange(range);
  }
};