CODEWITHSUNDEEP
javascriptline-breaks
user1551817
user1551817

Reputation: 7451

Line break in JavaScript not appearing

I know there are other questions on this site, but I can't get their suggestions to work for me.

I have some JavaScript:

displayString = 'Text to go on line 1'+'<br/>'+'Text to go on line 2';

This appears on my webpage as it should, except there is no line break, and it just appears as:

"Text to go on line 1<br/>Text to go on line 2"

I have tried '/n' too, but that seems to just be omitted.

Actual JavaScript:

$(document).ready(function(){
    $('#selectDirect').change(function(){
        if ($(this).val() === "450 Litre"){
            displayString = '450 Litre Vessel'+'<br/>'+'Combination Valve';
        }
        else if ($(this).val() === "550 Litre"){
            displayString = '550 Litre Vessel'+'<br/>'+'Combination Valve';
        }
        $("#choiceDisplay").text(displayString);
    });

Upvotes: 1

Views: 44

Answers (2)

mdatsev
mdatsev

Reputation: 3879

Try with .html() instead:

$("#choiceDisplay").html(displayString);

This will not escape html tags and in this case the <br/> tag.

Upvotes: 1

Barmar
Barmar

Reputation: 780974

Since you want HTML tags to be processed, you have to use .html(), not .text().

Upvotes: 6

Related Questions