I need to format text based on provided text specific style using react js. e.g:

1. If text contains this: nBubblenAirnSKY

Output: Bubble<br/>Air<br/>SKY<br/>

I need to show the output using html so in browser it should be show in each text in new line.

I have seen in XAML textbox (windows) if i add the text with new line then in the code it adds “n” in the code.

What i am tried to find the n and replace with <br/> tag.

var text = "nBubblenAirnSKY"
var newChar = new RegExp(/^[S.]+$/g);
var isNewLineExist = newChar.test(text);
if(isNewLineExist) //this is working fine if string contains newline character
     console.log('newline exist in string');
else
    console.log('newline does not exist in string');

//But below code for replace is not working. Where i tried to replace n with <br/> based on regex

    var replaceChar = text.replace(/^[n.]/g, "<br/>");
    console.log(replaceChar);
    return replaceChar;

I have tried with other regex then include() but they are not able to find if string contains n character.

Need help