Javascript replace all <br> with \n and vice versa

I have a need to have text go between a textarea and a div and a database

To get from the database to the screen I replace \r\n with <br> and it is displayed in the div

From javascript I do

document.getElementById("NotesTextArea").value = document.getElementById("Notes").innerHTML.replace(/&nbsp;/, '').replace(/<br>/, '\n');

Works perfect.  The text area is then edited by the user.  On save I upload changes to the database and do the following javascript:

document.getElementById("Notes").innerHTML = newNotes.replace(/\n/, '<br>');

The problem is that:


How Are you?

Looks like:

How Are you?

in the Notes div.  But if I click the link to reopen the editable text-area it shows properly.

Looking in the DOM inspector in Firefox I see:

Hello<br> How Are you? as the innerHTML and
Hello  How Are you? as the textContent (note the two spaces)

The child nodes look like:

[0] --> [object Text]  with data, textContent, and nodeValue all "Hello"
[1] --> [object HTMLBRElement]
[2] --> [object Text]  with data, textContent, and nodeValue all " How Are you?"

So obviously there is only 1 <br> element.

How do I get all \n instances to be replaced with <br> elements?  Preferrably without a loop - which I know I could do.

Oh I also already tried using \r\n in javascript - that didn't work and it is more accurate with just \n so far on the javascript side.
LVL 35
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Harisha M GEngineerCommented:
Try this...

document.getElementById("Notes").innerHTML.replace(/\s/, '').replace(/<br>/, '\n');
mrichmonAuthor Commented:
Umm.. I think I may have confused you.  It is actually the other direction :

document.getElementById("Notes").innerHTML = newNotes.replace(/\n/, '<br>');

That is having the problems.
Harisha M GEngineerCommented:
Actually there are two spaces, which get converted to two newline characters, which inturn get converted to two <br>

Is it not?
Your Guide to Achieving IT Business Success

The IT Service Excellence Tool Kit has best practices to keep your clients happy and business booming. Inside, you’ll find everything you need to increase client satisfaction and retention, become more competitive, and increase your overall success.

mrichmonAuthor Commented:
It is actually not a space that is being turned into the <br>  It is a newline character.

It is clear from my testing that the replace only is replacing the first instance.  Is there a non-looping way (maybe more regular expressions) to repalce all instances using javascript - or am I stuck with looping?
mrichmonAuthor Commented:
Found the solution finally!

I needed to add g to indicate global replacement

document.getElementById("Notes").innerHTML = newNotes.replace(/\n/g, '<br>');

Harisha M GEngineerCommented:
Question answered by asker or dialog deemed valuable.
Closed, 125 points refunded.
ee_ai_construct (replacement part #xm34)
Community Support Admin

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.