JSFiddle - React, Tailwind, and code Playground
HTML
<ul id="resultado"></ul>
CSS
strong {
background: yellow;
}
.ok {
color: green;
}
.erro {
color: red;
}
JavaScript
var regex = /^[^"]*(?:"(?:[^"\s]|[^"\s][^"]*[^"\s])?"[^"]*)*("(?:\s[^"]*|[^"]*\s)")[^"]*(?:"(?:[^"\s]|[^"\s][^"]*[^"\s])?"[^"]*)*$/;
var frases = [
'A notícia foi dada pelo " Jornal do Brasil".',
'Paris é considerada a "Cidade Luz ".',
'Gosto das cores "azul" e "preto".',
'"Teste um" "Teste dois".',
'etc',
'" etc"',
'"etc "',
'"etc" "etc"'
];
$.each(frases, function() {
var exec = regex.exec(this);
if ( exec ) {
var texto = this.replace(exec[1], "<strong>" + exec[1] + "</strong>");
$("<li>" + texto + "</li>").appendTo($("#resultado"))
.prepend('<span class="erro">[Erro] </span>');
}
else
$("<li>" + this + "</li>").appendTo($("#resultado"))
.prepend('<span class="ok">[OK] </span>');
});