Problem with line breaking JS

Question

The problem is this, when breaking the line in textarea in div .result where the result of what is typed in the textarea, he just gives a space and doesn’t break the line.

How do I make it break the line when one I jump the same in the textarea
Follow my code below:

$('.text').keyup(function(e) {
	$('span.result').html( $('.text').val() );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<textarea name="" class='text' placeholder='texto'></textarea>
<br/>
<span class='result'>texto</span>

Answer 1

For the line to break it is necessary to use the property word-wrap: break-word; in its CSS code as follows:

.result {
    word-wrap: break-word;
}

More information about this property on: CSS3 word-wrap Property