JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" class="title" />

JavaScript

$.fn.capitalize = function (e) {
  if(e.ctrlKey) return false;
  var wordsToIgnore = ["to", "and", "the", "it", "or", "that", "this"],
    minLength = 3;

  function getWords(str) {
    return str.match(/\S+\s*/g);
  }
  this.each(function () {
    var words = getWords(this.value);
    $.each(words, function (i, word) {
      // only continue if word is not in ignore list
      if (wordsToIgnore.indexOf($.trim(word).toLowerCase()) == -1 && $.trim(word).length > minLength) {
        words[i] = words[i].charAt(0).toUpperCase() + words[i].slice(1);
      }
    });
    var pos = getCaretPosition(this);
    this.value = words.join("");
    setCaretPosition(this, pos);
  });
};

$('.title').on('keyup', function (e) {
  var e = window.event || evt;
  if( e.keyCode == 17 || e.which == 17) return false;
  $(this).capitalize(e);
}).capitalize();


function getCaretPosition (ctrl) {
	var CaretPos = 0;	// IE Support
	if (document.selection) {
	ctrl.focus ();
		var Sel = document.selection.createRange ();
		Sel.moveStart ('character', -ctrl.value.length);
		CaretPos = Sel.text.length;
	}
	// Firefox support
	else if (ctrl.selectionStart || ctrl.selectionStart == '0')
		CaretPos = ctrl.selectionStart;
	return (CaretPos);
}
function setCaretPosition(ctrl, pos){
	if(ctrl.setSelectionRange)
	{
		ctrl.focus();
		ctrl.setSelectionRange(pos,pos);
	}
	else if (ctrl.createTextRange) {
		var range = ctrl.createTextRange();
		range.collapse(true);
		range.moveEnd('character', pos);
		range.moveStart('character', pos);
		range.select();
	}
}