We Keep Coding

How do I prevent a child string from ending the parent string?

Description:
I have a very simple button that I want to call a javascript function when clicked. Everything works fine with the function and the button with the exception of one issue that I can't seem to overcome.
The Javascript function copies a string in to the clipboard to be easily pasted for the user. The string is pulled in from another area that is free text for the user to put in what ever they want. However, if the user adds a double quote, it escapes the parent string.
Example:
Example of working code button:
<button id="Demo" onclick="copytoclipboard('some text to copy goes here')">Copy to Clipboard</button>
Example of when the button will not work:
<button id="Demo" onclick="copytoclipboard('some "text" to copy goes here')">Copy to Clipboard</button>
As you may be able to see, the first double quotation mark is ending the parent string.
What I have tried:
So far I have tried escaping the double quote but this doesn't appear to work due to the fact that it is a child string.
Example:
<button id="Demo" onclick="copytoclipboard('some \"text\" to copy goes here')">Copy to Clipboard</button>
Back to the question:
How do I prevent any double quotes in the child string the ending the parent string that is in turn preventing my onclick function to run?

This breaks down to: you're looking to escape data (doesn't matter whether plain text or javascript) in an XML (or more specifically HTML) attribute value.
You'll find plenty of info about that - in this case the easiest way is to escape the doublequote char (") via "
<button onclick="alert("foobar");">Click me</button>

The way that you tried escaping the double quote was almost perfect but you need to do it like this:
<button id="Demo" onclick='copytoclipboard("some \"text\" to copy goes here")'>Copy to Clipboard</button>
You can learn more about escaping special characters in here.

How to detect wrapped plain text and apply html markup using jquery?

The function of the jquery code I currently have is to detect text enclosed with parenthesis and it will serve as a text anchor to a link.
The problem is that parenthesis appears on the text anchor too. Is it possible to show only the text? Also if it's possible to change the parenthesis() into brackets []. thanks in advance.
$("body").html($("#wrapper").html().replace(/(\([^)]+\))/, "<a href='https://www.sample-url-here.com/'>$1</a>"));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">text (link here)</div>
The outcome I need should be:
from text [link here] to text link here

What about this? (jsfiddle)
$("body").html($("#wrapper").html().replace(/\(([^)]+)\)/, "[<a href='https://www.sample-url-here.com/'>$1</a>]"));
This will output a link surrounded by square brackets, with only the link underlined.
The problem with you original regular expression was that it was looking for anything not parentheses, surrounded by anything that is parenthesis, and that whole expression was surrounded by capturing parentheses.
In other words, let's look at it like this:
(x)
We'll call those your capturing parentheses. x can later be selected with $1.
x = \([^)]+\)
See the problem? Your entire x was being captured.
EDIT
jsfiddle updated to not show brackets.
EDIT
How about this one? jsfiddle

On setting background in a div using jQuery and JSON...

I've been working on a way to get an species of database with only JSON and I managed to get it working [who knew that a "js/" in the url would make it work? :'(]
But that's not the problem, now I got an issue with CSS. Well, let's explain it.
I have this JSON:
[
{
"title":"Facebook",
"url":"http://www.facebook.com",
"bg":"../img/facebook.png"
},
{
"title":"Twitter",
"url":"http://twitter.com",
"bg":"../img/twitter.png"
}
]
This Markup:
<section id="links">
<!-- here should be the <a>'s -->
</section>
And this JavaScript (using jQuery):
$(function(){
$.getJSON('js/links.json', function(data){
$.each(data, function(index){
$("#links").append('<span>'+data[index].title+'</span>');
});
});
});
Now you say: It should work. And sure it works, but the background simply does not display. Seems that HTML goes nuts as I've seen in the inspector.
Ok, then, what's wrong and what should I change?

I think the problem could be the way you have defined the style attribute.
style="background-image:url("'+data[index].bg+'");
The quotation mark directly after the opening parentheses is closing your style attribute. I would think simply removing it would do the trick
style="background-image:url('+data[index].bg+');
alternatively, replacing the double quote with an escaped single quote should also work
style="background-image:url(\''+data[index].bg+'\');

You need to escape your " " " with backslashes **\**

Passing apostrophe to javascript function

I am not finding a solution on this one using JavaScript (to utilize localStorage) in a JSP.
Trying to pass something with apostrophe. I have done a .replaceAll() and replaced the ' with ' and it still passes it as an '.
I have also tried a .split("'") and replaced the apostrophe with:
(\' , ' , \', '' , ''' and '\'')
All of these just pass an apostrophe to the function (what I see when I hover over the link) like this:
Save job
With a and b being the two split substrings but with no effect. I do notice that spaces are converted into %20, but that's little comfort. Any other ideas?

Your JSP code is irrelevant. Decide what HTML you want to produce and produce it.
The following are all valid HTML markup:
<a href="saveJob('Bob\'s Question')"> …
<a href="saveJob("Bob&apos;s Question")"> …
<a href="saveJob('He said "Go Away"')"> …
<a href='saveJob("He said \"Go Away\"")"> …
… and the following are invalid:
<a href="saveJob('Bob's Question')"> <!-- JS string ends early -->
<a href="saveJob("Bob's Question")"> <!-- HTML attribute ends early -->
<a href="saveJob('Bob&apos;s Question')"> <!-- JS string ends early -->
<a href="saveJob('He said "Go Away"')"> <!-- HTML attribute ends early -->
You cannot use your HTML attribute delimiter in your attribute value except as an HTML entity. You cannot use your JavaScript string delimiter in your JavaScript string unless you escape it, even if you use an HTML entity to describe it.
In general, you should not be putting JavaScript in your HTML (you should attach event handlers to your markup programmatically, from script), and you especially shouldn't be abusing an HTML anchor as a JavaScript trigger (either use an HTML anchor to a valid URL and let JavaScript hijack the link if enabled, or use a <button> or other element to invoke script-only side effects).

As you've noticed, such manual string escape tasks can be quite tricky; covering apostrophes won't even get you all the way: what if there's a newline in the string? That would break the script as well.
I would recommend converting your data to a JSON object, perhaps using JSON-taglib. This should take care of all required escaping for you.

The Phrogz solution
<a href="saveJob("Bob&apos;s Question")">
works fine if you have only apostrophes in your text.
If your text contains both apostrophes and quotes, you can use a hidden div (div with style='display:none;') for the text, pass the id of the div to saveJob instead of passing the text itself, and get the text inside saveJob by using
document.getElementById(myId).innerHTML

JavaScript within an <a> tag, nested, quote problem

Here is simple <a> tag, which links to an exe file. The onClick JavaScript event redirects the user to another webpage after 3 seconds.
<a href="http://www.example.com/download.exe"
onClick="setTimeout('window.location="/downloading.html"',3000);return true;">
LINK</a>
So it doesn't work because there are too many nested quotes.
The first quotes "" are for the onClick function.
The second quotes '' are for the SetTimeout function.
I need third quotes for the window.location function. I've tried using both ' and " but none work. The above syntax fails.
I can solve it by refactoring the JavaScript into a function, but there are reasons why I cannot implement that. Is there a solution to this?
EDIT:
The answers below did not quite work, but led me to the correct solution:
onClick="setTimeout('window.location=\'/downloading.html\'',3000);return true;"

You need to escape the quotes:
Something

You need to escape the inner double quote with backslash.
Here is the example:
<a href="http://www.example.com/download.exe"
onClick="setTimeout('window.location=\"/downloading.html\"',3000);return true;"</a>