jQuery innerHTML does not work properly (!)

I was trying to build an <a> tag and set it in a <td> of a table. The string is built perfectly but when I set this as the innerHTML using jQuery, the string gets broken. I can't figure out why this is happening? Any clues?

Here's the string I want to set in the <td>:

<a onclick='return EditIssueItemBatch('1c1e27a2-beac-4772-a26f-6a7e05529a65', '498ba483-ca06-4b23-b3a9-0085e4760ff1')'>Edit</a>

But here is how it looks after setting as innerHTML:

<A onclick="return EditIssueItemBatch(" ?498ba483-ca06-4b23-b3a9-0085e4760ff1?)? 1c1e27a2-beac-4772-a26f-6a7e05529a65?,>Edit</A>

And the开发者_StackOverflow社区 following is my code-snippet..

var tr = $("#itemIssueBatchListTable > tbody:last").children()[data.Index + 1];
...
...
var strBuff = [];
strBuff.push("<a onclick='return EditIssueItemBatch('");
strBuff.push(data.ItemIssueBatch.ItemCode_FK);
strBuff.push("', '");
strBuff.push(data.ItemIssueBatch.StockDetCode_FK);
strBuff.push("')'>Edit</a>");
tr.cells[9].innerHTML = strBuff.join("");
...
...

You're terminating your onclick attribute at the end of the first strBuff.push call by using single quotes to both surround the attribute value and inside its contents - you must mix your quotes:

var strBuff = [];
strBuff.push("<a onclick=\"return EditIssueItemBatch('");
strBuff.push(data.ItemIssueBatch.ItemCode_FK);
strBuff.push("', '");
strBuff.push(data.ItemIssueBatch.StockDetCode_FK);
strBuff.push("')\">Edit</a>");
tr.cells[9].innerHTML = strBuff.join("");

In fact, the "desired" HTML you have written out in your question wouldn't work either for the same reason.

try tr.cells[9].html(strBuff.join("")) instead.