Am I escaping the strings incorrectly in JavaScript?

Question

I am trying to create a clickable link in javascript

var content = '<a href=\"#\" onclick=\"displayContent(\"TEST\")\">Whatever</a>';

$("#placeHolder").html(content);

but I keep getting an error

Uncaught SyntaxError: Unexpected token }

Is that not the correct way to escape double quotes and create a link?

Answer 1

You only need to escape the single quotes

var content = '<a href="#" onclick="displayContent(\'TEST\')">Whatever</a>'

As bozdoz says:

You escape single quotes that are within single quotes; you escape double quotes that are within double quotes

---

But why not do

var content = $("<a />").attr("href", "#").text("Whatever").click(function(){
     displayContent('TEST')
});

Or as Nathan says:

var content = $('<a href="#">Whatever</a>').click(
     function() { displayContent('TEST') 
});

Answer 2

You can avoid that mess by creating elements like this:

var content = $( "<a>", {
    href: "#",
    text: "whatever",
    click: $.proxy( displayContent, 0, "TEST" )
});