JSFiddle - React, Tailwind, and code Playground
HTML
<input type="text" class="title" />
JavaScript
$.fn.capitalize = function () {
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);
}
});
this.value = words.join("");
});
};
$('.title').on('keyup', function () {
$(this).capitalize();
}).capitalize();