New line for each comma!

1

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.

2

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
3

Hey Kev,

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

4

This is how it gets rendered in the browser:

31
311450×116 12.6 KB

5

Something like this might work:

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

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

But still no luck!

7

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

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

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.