Non interpreta i br perché viene usato il metodo text()
Per preservare i br basta usare il quasi analogo metodo html()
codice:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<meta charset=utf-8 />
<title>EDIT</title>
</head>
<body>
<p class="first">mihi plus quam phantastica venit
historiam Baldi grassis cantare Camoenis.
Altisonam cuius phamam, nomenque gaiardum
terra tremat, baratrumque metu sibi cagat adossum.
Sed prius altorium vestrum chiamare bisognat,
o macaroneam Musae quae funditis artem.
An poterit passare maris mea gundola scoios,
quam
recomandatam non vester aiuttus habebit?
Non mihi Melpomene, mihi non menchiona Thalia,
non Phoebus grattans chitarrinum carmina dictent;
panzae namque meae quando ventralia penso,
non facit ad nostram Parnassi chiacchiara pivam.
Pancificae tantum Musae, doctaeque sorellae,
Gosa, Comina, Striax, Mafelinaque, Togna,
Pedrala,
imboccare suum veniant macarone poëtam,
dentque polentarum vel quinque vel octo cadinos.
Hae sunt divae illae grassae, nymphaeque colantes,
albergum quarum, regio, propiusque primior artem,
hic me pancificum fecit Mafelina poëtam.</FONT></FONT></P>
<p class="second"></p>
<script>
$(".first").on("hover",function(){
var words = $(this).html().split(" ");
var fullText = "";
for(i=0;i<words.length;i++){
words[i] = "<span>"+words[i]+"</span> ";
fullText += words[i];
}
$(this).html(fullText)
$(this).children("span").on("hover", function(){
$(".second").text($(this).text());
});
});
</script>
</body>
</html