Typing text in jQuery

Question

Guys, I want the text to print in two lines.

Here is my demo

Plz check this code

HTML

<div id="container"> <div class="writer">Hi! This is a test text. <br><br> Can any one Help me in this ?.</div> </div> 

JAVA SCRIPT

 var txt = $('.writer').text(); var timeOut; var txtLen = txt.length; var char = 0; $('.writer').text('|'); (function typeIt() { var humanize = Math.round(Math.random() * (200 - 30)) + 30; timeOut = setTimeout(function() { char++; var type = txt.substring(0, char); $('.writer').text(type + '|'); typeIt(); if (char == txtLen) { $('.writer').text($('.writer').text().slice(0, -1)); // remove the '|' clearTimeout(timeOut); } }, humanize); }()); 

Answer 1

You can add white-space: pre-line; declaration in .writer to break lines as follows:

 .writer { font:bold 23px arial; white-space: pre-line; } 

WORKING DEMO

16.6 White Space: The White Space Property

pre-line This value directs user agents to smooth sequences of spaces. lines are divided into saved newline characters, and fill in line as necessary.

It is worth noting that the pre-line value is supported in IE8 + .