Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

329
Views
Line-breaks in between of text using JS ,(Dynamically)

I am stuck on a very beginner problem in JS, what I'm trying to do is add line-breaks in between text which the script adds dynamically after generating a random string, but I could not find a source that would match my case

The code that picks a random string

var textArray = [
    'Gateway to wild imaginations!',
    'Activating the send portal :D',
    'Empowering nothing ;P'
];
var randomNumber = Math.floor(Math.random()*textArray.length);
var rndStr = textArray[randomNumber];

const h_1_elem = document.getElementById('main-h1');
h_1_elem.innerText = rndStr;

I would consider myself a beginner in programming so take this question with a pinch of salt

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

Don't use .innerText and instead use .innerHTML along with the HTML line break element of <br>:

var textArray = [
    'Gateway to wild imaginations!',
    'Activating the send portal :D',
    'Empowering nothing ;P'
];

var rndStr = textArray[Math.floor(Math.random()*textArray.length)];

const h_1_elem = document.getElementById('main-h1');
h_1_elem.innerHTML = rndStr + "<br>";
rndStr = textArray[Math.floor(Math.random()*textArray.length)];
h_1_elem.innerHTML += rndStr + "<br>";
<div id="main-h1"></div>

about 4 years ago · Juan Pablo Isaza Report

0

You could use \n to insert a new line since you are using

h_1_elem.innerText = rndStr + "\n";

Also I created a function called randomNumber in order to call it more than one time.

var textArray = [
    'Gateway to wild imaginations!',
    'Activating the send portal :D',
    'Empowering nothing ;P'
];

const h_1_elem = document.getElementById('main-h1');
h_1_elem.innerText = textArray[randomNumber()] + "\n";
h_1_elem.innerText += textArray[randomNumber()] + "\n";

function randomNumber() {
  let number = Math.floor(Math.random()*textArray.length);
  return number;
}
<div id="main-h1"></div>

If you run the code multiple times, you will get different messages. Just keep adding more :)

Regards

============ EDITED ============

Oh, you want a break line after each word. Didn't understand the question that way. So, for that you should use something like this:

var textArray = [
    'Gateway to wild imaginations!',
    'Activating the send portal :D',
    'Empowering nothing ;P'
];

const h_1_elem = document.getElementById('main-h1');
h_1_elem.innerText = textArray[randomNumber()].replaceAll(" ","\n");

function randomNumber() {
  let number = Math.floor(Math.random()*textArray.length);
  return number;
}
<div id="main-h1"></div>

I just used

replaceAll(" ", "\n")

In order to replace every space by a break line. Hope this is what you want.

Regards

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!