Solution 1 :

First you should not be using value for an html element. You can use .value for extracting value from inputs. Change your line to:

var val = document.getElementById('output2').innerHTML;

Afterwards, you have to split the same way you did join.

var dates3 = val.split('<br>');

document.getElementById('output3').innerHTML = dates3;

Solution 2 :

You can directly use join, something like:

document.getElementById('output3').innerHTML = dates.join(',');

Solution 3 :

You can try mapping over the contents of dates instead, as so:

let datesElem = =>`<p>${date}</p>`);
// test: console.log(datesElem)

document.getElementById('output3').innerHTML = datesElem

Problem :

I have an array that comes in from from my API that I would like to arrange in a way that is better for the user (namely, in a column as opposed to the typical comma separated printed array).

This is my JS Fiddle to give a clearer picture:

My question is, how can I get output3 to display just like output (and maintain its status as an iterable array like it was as dates)?


Leave a Reply

Your email address will not be published. Required fields are marked *