上記画像の緑のフォントのやつです。単純にmarkタグを前後に入れてcssを整えれば完成。
highlightKey($('input#q').val())
function highlightKey(key){
var valThis = key;
$('table').find('tr td').each(function() {
if ($(this).attr('data-search') !== 'false') {
var text = $(this).text();
var textL = text.toLowerCase();
var position = textL.indexOf(valThis.toLowerCase());
var regex = new RegExp(valThis, 'ig');
text = text.replace(regex, (match, $1) => {
// Return the replacement
return '<mark>' + match + '</mark>';
});
$(this).html(text);
if (position !== -1) {
setTimeout(function() {
if ($(this).parent().find('mark').is(':empty')) {
$('mark').remove();
}
}.bind(this), 0);
} else {
$(this).text(text);
}
}
});
}