Mixing
How to start a new line within a string within an array?
1
I made a random quote generator on CodePen (url: https://codepen.io/hearamsey/pen/ebyLXj)
I set up my quotes in an array in my JS, but I want the author of the quote to be on a new line.
I have tried inserting n where I want the line breaks:
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. n -Dr. Seuss",
"Imitation is suicide. n -Ralph Waldo Emerson", ...]
I would like it to display:
Imitation is suicide.
-Ralph Waldo Emerson
javascript arrays
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
add a comment |
1
I made a random quote generator on CodePen (url: https://codepen.io/hearamsey/pen/ebyLXj)
I set up my quotes in an array in my JS, but I want the author of the quote to be on a new line.
I have tried inserting n where I want the line breaks:
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. n -Dr. Seuss",
"Imitation is suicide. n -Ralph Waldo Emerson", ...]
I would like it to display:
Imitation is suicide.
-Ralph Waldo Emerson
javascript arrays
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
add a comment |
1
1
1
I made a random quote generator on CodePen (url: https://codepen.io/hearamsey/pen/ebyLXj)
I set up my quotes in an array in my JS, but I want the author of the quote to be on a new line.
I have tried inserting n where I want the line breaks:
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. n -Dr. Seuss",
"Imitation is suicide. n -Ralph Waldo Emerson", ...]
I would like it to display:
Imitation is suicide.
-Ralph Waldo Emerson
javascript arrays
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
I made a random quote generator on CodePen (url: https://codepen.io/hearamsey/pen/ebyLXj)
I set up my quotes in an array in my JS, but I want the author of the quote to be on a new line.
I have tried inserting n where I want the line breaks:
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. n -Dr. Seuss",
"Imitation is suicide. n -Ralph Waldo Emerson", ...]
I would like it to display:
Imitation is suicide.
-Ralph Waldo Emerson
javascript arrays
javascript arrays
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
asked Jan 3 at 0:54
Heather RamseyHeather Ramsey
82
82
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
0
If your quotes array is going to be static, then try splitting out n from string and replace it with <br/>. Otherwise you can manually replace n with <br/> in array of quotes.
I have made a custom function checkSeperator which returns finalized string by splitting string with n and joins with <br/>.
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
Final Code :
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. <br/> -Dr. Seuss",
"We must not allow other people’s limited perceptions to define us. n -Virginia Satir",
"Don’t look for society to give you permission to be yourself. n -Steve Maraboli",
"If things go wrong, don’t go with them. n -Roger Babson",
"Wanting to be someone else is a waste of who you are. n -Kurt Cobain",
"Tension is who you think you should be. Relaxation is who you are. n -Chinese Proverb",
"Where’s your will to be weird? n -Jim Morrison",
"Some people say you are going the wrong way, when it’s simply a way of your own. n -Angelina Jolie",
"Remember to always be yourself. Unless you suck. n -Joss Whedon",
"Do what you can, with what you have, where you are. n -Theodore Roosevelt",
"To find yourself, think for yourself. n -Socrates",
"If you seek authenticity for authenticity’s sake you are no longer authentic. n -Jean Paul Sartre",
"Do what you must, And your friends will adjust. n -Robert Brault",
"Just let awareness have its way with you completely.<br/> -Scott Morrison",
"We must be our own before we can be another’s. <br/> -Ralph Waldo Emerson",
"This above all: to thine own self be true. <br/> -William Shakespeare"
];
function newQuote() {
var randomNumber = Math.floor(Math.random() * quotes.length);
document.getElementById("quoteDisplay").innerHTML = checkSeperator(
quotes[randomNumber]
);
}
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
You can paste this code in codepen in js tab and it'll work.
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
1
Thank you, that clarifies things for me and saved me a bit of time!
– Heather Ramsey
Jan 3 at 1:36
I am glad to provide an assist
– Meet Zaveri
Jan 3 at 3:05
add a comment |
2
You are injecting that string as HTML through innerHTML so you need to replace the n with the tag for starting a new line in HTML, which is: br
document.querySelector('#test').innerHTML = 'BLA BLA <br/> BLA';<div id="test"></div>answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54015054%2fhow-to-start-a-new-line-within-a-string-within-an-array%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
If your quotes array is going to be static, then try splitting out n from string and replace it with <br/>. Otherwise you can manually replace n with <br/> in array of quotes.
I have made a custom function checkSeperator which returns finalized string by splitting string with n and joins with <br/>.
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
Final Code :
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. <br/> -Dr. Seuss",
"We must not allow other people’s limited perceptions to define us. n -Virginia Satir",
"Don’t look for society to give you permission to be yourself. n -Steve Maraboli",
"If things go wrong, don’t go with them. n -Roger Babson",
"Wanting to be someone else is a waste of who you are. n -Kurt Cobain",
"Tension is who you think you should be. Relaxation is who you are. n -Chinese Proverb",
"Where’s your will to be weird? n -Jim Morrison",
"Some people say you are going the wrong way, when it’s simply a way of your own. n -Angelina Jolie",
"Remember to always be yourself. Unless you suck. n -Joss Whedon",
"Do what you can, with what you have, where you are. n -Theodore Roosevelt",
"To find yourself, think for yourself. n -Socrates",
"If you seek authenticity for authenticity’s sake you are no longer authentic. n -Jean Paul Sartre",
"Do what you must, And your friends will adjust. n -Robert Brault",
"Just let awareness have its way with you completely.<br/> -Scott Morrison",
"We must be our own before we can be another’s. <br/> -Ralph Waldo Emerson",
"This above all: to thine own self be true. <br/> -William Shakespeare"
];
function newQuote() {
var randomNumber = Math.floor(Math.random() * quotes.length);
document.getElementById("quoteDisplay").innerHTML = checkSeperator(
quotes[randomNumber]
);
}
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
You can paste this code in codepen in js tab and it'll work.
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
1
Thank you, that clarifies things for me and saved me a bit of time!
– Heather Ramsey
Jan 3 at 1:36
I am glad to provide an assist
– Meet Zaveri
Jan 3 at 3:05
add a comment |
0
If your quotes array is going to be static, then try splitting out n from string and replace it with <br/>. Otherwise you can manually replace n with <br/> in array of quotes.
I have made a custom function checkSeperator which returns finalized string by splitting string with n and joins with <br/>.
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
Final Code :
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. <br/> -Dr. Seuss",
"We must not allow other people’s limited perceptions to define us. n -Virginia Satir",
"Don’t look for society to give you permission to be yourself. n -Steve Maraboli",
"If things go wrong, don’t go with them. n -Roger Babson",
"Wanting to be someone else is a waste of who you are. n -Kurt Cobain",
"Tension is who you think you should be. Relaxation is who you are. n -Chinese Proverb",
"Where’s your will to be weird? n -Jim Morrison",
"Some people say you are going the wrong way, when it’s simply a way of your own. n -Angelina Jolie",
"Remember to always be yourself. Unless you suck. n -Joss Whedon",
"Do what you can, with what you have, where you are. n -Theodore Roosevelt",
"To find yourself, think for yourself. n -Socrates",
"If you seek authenticity for authenticity’s sake you are no longer authentic. n -Jean Paul Sartre",
"Do what you must, And your friends will adjust. n -Robert Brault",
"Just let awareness have its way with you completely.<br/> -Scott Morrison",
"We must be our own before we can be another’s. <br/> -Ralph Waldo Emerson",
"This above all: to thine own self be true. <br/> -William Shakespeare"
];
function newQuote() {
var randomNumber = Math.floor(Math.random() * quotes.length);
document.getElementById("quoteDisplay").innerHTML = checkSeperator(
quotes[randomNumber]
);
}
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
You can paste this code in codepen in js tab and it'll work.
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
1
Thank you, that clarifies things for me and saved me a bit of time!
– Heather Ramsey
Jan 3 at 1:36
I am glad to provide an assist
– Meet Zaveri
Jan 3 at 3:05
add a comment |
0
0
0
If your quotes array is going to be static, then try splitting out n from string and replace it with <br/>. Otherwise you can manually replace n with <br/> in array of quotes.
I have made a custom function checkSeperator which returns finalized string by splitting string with n and joins with <br/>.
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
Final Code :
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. <br/> -Dr. Seuss",
"We must not allow other people’s limited perceptions to define us. n -Virginia Satir",
"Don’t look for society to give you permission to be yourself. n -Steve Maraboli",
"If things go wrong, don’t go with them. n -Roger Babson",
"Wanting to be someone else is a waste of who you are. n -Kurt Cobain",
"Tension is who you think you should be. Relaxation is who you are. n -Chinese Proverb",
"Where’s your will to be weird? n -Jim Morrison",
"Some people say you are going the wrong way, when it’s simply a way of your own. n -Angelina Jolie",
"Remember to always be yourself. Unless you suck. n -Joss Whedon",
"Do what you can, with what you have, where you are. n -Theodore Roosevelt",
"To find yourself, think for yourself. n -Socrates",
"If you seek authenticity for authenticity’s sake you are no longer authentic. n -Jean Paul Sartre",
"Do what you must, And your friends will adjust. n -Robert Brault",
"Just let awareness have its way with you completely.<br/> -Scott Morrison",
"We must be our own before we can be another’s. <br/> -Ralph Waldo Emerson",
"This above all: to thine own self be true. <br/> -William Shakespeare"
];
function newQuote() {
var randomNumber = Math.floor(Math.random() * quotes.length);
document.getElementById("quoteDisplay").innerHTML = checkSeperator(
quotes[randomNumber]
);
}
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
You can paste this code in codepen in js tab and it'll work.
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
If your quotes array is going to be static, then try splitting out n from string and replace it with <br/>. Otherwise you can manually replace n with <br/> in array of quotes.
I have made a custom function checkSeperator which returns finalized string by splitting string with n and joins with <br/>.
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
Final Code :
var quotes = [
"How many cares one loses when one decides not to be something but to be someone. n -Gabrielle “Coco” Chanel",
"Be who you are and say what you feel, because those who mind don’t matter and those who matter don’t mind. <br/> -Dr. Seuss",
"We must not allow other people’s limited perceptions to define us. n -Virginia Satir",
"Don’t look for society to give you permission to be yourself. n -Steve Maraboli",
"If things go wrong, don’t go with them. n -Roger Babson",
"Wanting to be someone else is a waste of who you are. n -Kurt Cobain",
"Tension is who you think you should be. Relaxation is who you are. n -Chinese Proverb",
"Where’s your will to be weird? n -Jim Morrison",
"Some people say you are going the wrong way, when it’s simply a way of your own. n -Angelina Jolie",
"Remember to always be yourself. Unless you suck. n -Joss Whedon",
"Do what you can, with what you have, where you are. n -Theodore Roosevelt",
"To find yourself, think for yourself. n -Socrates",
"If you seek authenticity for authenticity’s sake you are no longer authentic. n -Jean Paul Sartre",
"Do what you must, And your friends will adjust. n -Robert Brault",
"Just let awareness have its way with you completely.<br/> -Scott Morrison",
"We must be our own before we can be another’s. <br/> -Ralph Waldo Emerson",
"This above all: to thine own self be true. <br/> -William Shakespeare"
];
function newQuote() {
var randomNumber = Math.floor(Math.random() * quotes.length);
document.getElementById("quoteDisplay").innerHTML = checkSeperator(
quotes[randomNumber]
);
}
function checkSeperator(str) {
if (str.includes("n")) {
var finalStr = str.split("n").join(" <br/> ");
return finalStr;
} else {
return str;
}
}
You can paste this code in codepen in js tab and it'll work.
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
edited Jan 3 at 3:03
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
answered Jan 3 at 1:13
Meet ZaveriMeet Zaveri
7511816
7511816
1
Thank you, that clarifies things for me and saved me a bit of time!
– Heather Ramsey
Jan 3 at 1:36
I am glad to provide an assist
– Meet Zaveri
Jan 3 at 3:05
add a comment |
1
Thank you, that clarifies things for me and saved me a bit of time!
– Heather Ramsey
Jan 3 at 1:36
I am glad to provide an assist
– Meet Zaveri
Jan 3 at 3:05
1
1
Thank you, that clarifies things for me and saved me a bit of time!
– Heather Ramsey
Jan 3 at 1:36
Thank you, that clarifies things for me and saved me a bit of time!
– Heather Ramsey
Jan 3 at 1:36
I am glad to provide an assist
– Meet Zaveri
Jan 3 at 3:05
I am glad to provide an assist
– Meet Zaveri
Jan 3 at 3:05
add a comment |
2
You are injecting that string as HTML through innerHTML so you need to replace the n with the tag for starting a new line in HTML, which is: br
document.querySelector('#test').innerHTML = 'BLA BLA <br/> BLA';<div id="test"></div>answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
add a comment |
2
You are injecting that string as HTML through innerHTML so you need to replace the n with the tag for starting a new line in HTML, which is: br
document.querySelector('#test').innerHTML = 'BLA BLA <br/> BLA';<div id="test"></div>answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
add a comment |
2
2
2
You are injecting that string as HTML through innerHTML so you need to replace the n with the tag for starting a new line in HTML, which is: br
document.querySelector('#test').innerHTML = 'BLA BLA <br/> BLA';<div id="test"></div>answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
You are injecting that string as HTML through innerHTML so you need to replace the n with the tag for starting a new line in HTML, which is: br
document.querySelector('#test').innerHTML = 'BLA BLA <br/> BLA';<div id="test"></div>document.querySelector('#test').innerHTML = 'BLA BLA <br/> BLA';<div id="test"></div>document.querySelector('#test').innerHTML = 'BLA BLA <br/> BLA';<div id="test"></div>answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
answered Jan 3 at 0:57
quirimmoquirimmo
7,71811536
7,71811536
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54015054%2fhow-to-start-a-new-line-within-a-string-within-an-array%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
