New line for each comma!

Hi folks,

So I have a tag

<address>1 main street,Main Road,90201,Country</address>

As you can see it is all bunched up and not nice. I want to make a new line every time there is a comma.

To do this I have done the following:

let address = document.getElementsByTagName('Address');

Then what I try to do is split the string by doing this:

let formattedString = address.split(",").join("\n");

But this is where I am stuck at. I just get errors and not the desired effect of the text being on new lines

Please help!

Cheers,
John.

Why not replace the commas with <br> in the HTML?

To add, you’re getting an error because address is not a string, but rather a very complex object.

1 Like

Hey Kev,

The data is dynamically rendered and not just simple HTML, otherwise I would just format it correctly - cheers :slight_smile:

This is how it gets rendered in the browser:

Something like this might work:

address.innerHTML = address.textContent.replace(/,/g, '<br>')
1 Like

Thanks for that but it doesn’t work. I tried a JS Fiddle:

https://jsfiddle.net/x82o60zy/

But still no luck!

getElementsByTagName returns a list of elements, not just a single element. Try:

let address = document.getElementsByTagName('address')[0];
1 Like

Yeah, doh! It does return an array, I should have remembered that and used zero-based index for the element. I’ve done this before, I just struggle getting it to stick in my head…

Thanks so much for the help!

Cheers :slight_smile: Happy Weekend.