JSFiddle - React, Tailwind, and code Playground
HTML
<div id="texte-a">La nuit descend, je pressens</div>
<div id="texte-b">La nuit pressent, je descend</div>
CSS
.yellow {
background-color:yellow;
}
JavaScript
$(document).ready(function() {
var text_a;
var text_b;
$('#texte-a').each(function() {
text_a = $(this).text().split(' ');
for (var i = 0 in text_a) {
text_a[i] = '<span class="word">' + text_a[i] + '</span>';
}
$(this).html(text_a.join(' '));
});
$('#texte-b').each(function() {
text_b = $(this).text().split(' ');
for (var i = 0 in text_b) {
text_b[i] = '<span class="word">' + text_b[i] + '</span>';
}
$(this).html(text_b.join(' '));
});
check(text_a, text_b);
});
function check(text_a, text_b) {
for (var i = 0 in text_a) {
if (text_a[i] != text_b[i]) {
$('#texte-a span:eq('+i+')').addClass('yellow');
$('#texte-b span:eq('+i+')').addClass('yellow');
}
}
}