javascript - Newline is being printed as a whitespace in Text Area of html. How do I resolve

Question

This is my small jquery script where I append data that I receive.

$.get('HelloWorld', {'data' : data}, function(newLogs) {
    $('#logsid').append(newLogs);
    $('#logsid').scrollTop($('#logsid')[0].scrollHeight);
});

Answer 1

By default, HTML renders newlines as spaces (and multiple whitespace is collapsed to one space). Add this rule to your stylesheet to preserve whitespace...

#logsid {
    white-space: pre;
}

Or you can do this in jQuery...

$('#logsid').css("white-space", "pre");

You can also achieve this by changing logsid to be a <pre> element.