how to assign apostrophe character to a html data attribute value?

Question

Step 1 -

I use a post method to return data values and the data values may return apostrophe character and assign the value to a variable. For example,

var returnData = "Test's failure";

Step 2 -

Next, I attempt to assign the variable to the value of a data type like this:

$("testList").append("<li data-test='"+ returnData +"'>" + test_List + " </li>);

Summary -

When using firebug to view the value for the variable returnData placed in the attribute data-test, it shows the value of Test and 's failure is not added. How can I fix this problem?

You need to escape your HTML. See here http://stackoverflow.com/questions/24816/escaping-html-strings-with-jquery — Dmitry Osinovskiy, Jul 14 '12 at 20:14

score 2 · Accepted Answer · answered Jul 14 '12 at 20:14

Just to be on the safe side:

$("<li />").data("test", returnData).html(test_List).appendTo("#testList");

Or if you need the attribute:

$("<li />", {
    "data-test" : returnData
}).html(test_List).appendTo("#testList");

DEMO: http://jsfiddle.net/ZyMCk/

how to assign apostrophe character to a html data attribute value?

1 Answers1