We Keep Coding

While using object.innerHTML or $object.append when creating a div tag with an onclick event it won't allow me to pass variables too it

I'm creating a chat application where when a message is received the user can click on the message and see information about it, the application works and there are no errors in any other part of the code however, when I add the message to the chat div element (in it's own div), although the message shows with the variables passed in correctly (usernames, color of text and message) when I add the onclick element it won't display the information.
I have tried two possible methods:
Using jquery and appending:
$chat.append("<div id =\'"+user+"\' style=\'color:"+color+";\' onclick='alert("+user+")'>"+user+ ": " + msg + "<br/></div>");
Using innerHTML:
var content = chat.innerHTML;
chat.innerHTML = content + "<div id=\'"+user+"\' style=\'color:"+color+";\' onclick='alert("+user+")'>"+user+ ": "+msg+"<br/><div>";
As said, everything else works fine but the onclick function does not work and displays an alert box but with no information just "[object HTMLcollection]".

You have something strange with quotes. Try this:
$('.chat').append('<div id =' + user + ' style=color:' + color + ';onclick=alert("' + user + '")>' + user + ': ' + msg + '<br/></div>');
EDIT: You don't need to add extra quotes for id value or style value but need to add it for alert argument instead.

Child window innerHTML displaying as text if sent via string variable

I am trying to create a web page that will enable a child window to display some additional text when a gridview row is double clicked.
I am grabbing the HTML text from a hidden column of the gridview and sending it through as follows :
Dim outputText As String = (e.Row.Cells(12).Text)
e.Row.Attributes.Add("ondblclick", "var openWindow = window.open('Child.htm','Ratting','width=550,height=170,0,status=0,');openWindow.document.getElementById('content2').innerHTML = '" + outputText + "';") 'openWindow.init();")
When the window pops up, the HTML is displayed as text - tags and all.
If I use the following and paste the same text within the code - rather than via the string, the HTML displays correctly.
e.Row.Attributes.Add("ondblclick", "var openWindow = window.open('Child.htm','Ratting','width=550,height=170,0,status=0,');openWindow.document.getElementById('content2').innerHTML = " + chr(34) + "<img src='http://www.test.com/images/image%201.jpg'/><br/><br/>Some more text"+ chr(34) + ";") 'openWindow.init();")
Could anyone point me in the right direction please? I can't figure out what's wrong and it's been driving me mad.
Thanks.

So I figured this out.
It seems when the text is posted via a variable, the tags < and > get replaced by '&lt' and '&gt'
So to fix it, I appended this after I set the innerHTML :
openWindow.document.body.innerHTML=openWindow.document.body.innerHTML.split('<').join('<').split('>').join('>');
And it's done the trick!

upgrading javascript that adds a link to a field

I am trying to change the Sales Stage field label to a hyperlink to pop up a new browser window.
Currently I have a form with a Sales Stage field that has a drop down::
The underlying HTML:
<td title="Select the sales process stage for the opportunity to indicate the probability of closing the opportunity." class="ms-crm-ReadField-Normal ms-crm-FieldLabel-LeftAlign" id="salesstagecode_c"><span class="ms-crm-InlineEditLabel"><span class="ms-crm-InlineEditLabelText" style="text-align: left; max-width: 115px;">Sales Stage</span><div class="ms-crm-Inline-GradientMask" style="display: none;">
</div></span></td>
or perhaps better formatted:
The function that I used previously worked on an older version of the form:
function csjs_AddHyperlinkToLabel(sFieldId, sURL, sWindowOptions) {
    var sCurrentLabel = $("label[for='" + sFieldId + "']").html();
    $("label[for='" + sFieldId + "']").html("" + sCurrentLabel + "");
}
the function above worked on a form with the following html::
What changes would be required to the javascript to change the Sales Stage field label to a hyperlink to pop up a new browser window?
Though I'd be very grateful for a solution, I'm looking for guidance on how to accomplish this. Thank you for your attention and time.
Unfortunately, the solutions below did not work. I ran this through the debugger and here's what I got http://screencast.com/t/fT6tHvXZzvc
The issue here is that we are passing “salesstagecode” to this function:
csjs_AddHyperlinkToLabel("salesstagecode", sPageURL, sWindowFeatures);
and this turns out to be NULL:
var sCurrentLabel = $("label[for='" + sFieldId + "']").html();
*
The issue is that Microsoft changed the way the forms are rendered and
the HTML of the rendered page will no longer work with the way the
function was written. The label is now in a span tag instead of a
label tag. I don't know if there is a way to identify that span and
change the contents to have new HTML to make the text link.
*
How do you update a span tag?

You need to add target="_blank" attribute in your hyperlink markup.

Simple:
change
.... onclick=\"window.open('" + sURL + "', null, '" ....
to
.... onclick=\"window.open('" + sURL + "', '_blank', '" ....

Appended h1 tag not recognized

I have this page where I append my h1-tag with jquery like:
$('.name').append('<h1 style="margin-bottom=20px;">' + name +'</h1>');
The h1 tag, and the content of the tag, displays nicely, but when I test my page in various seo tools ( for example this one: http://www.seositecheckup.com/) I get the message that the page has no h1 tag.
Which of course is not so good from a seo point of view. Does anyonme recognize this problem? On a similar note: On the homepage I print out a list with with a javascript for loop and append the listing html and content:
$('#list').append("<div class='point'><a href='" + str + "&id=" + id + "' onmouseover='infoShow(" + i + ")' onmouseout='infoClose(" + i + ")'><H3>" + titel +
"</H3></a><div class='address'>" + name + "</div>" + trivsel + "<div class='star"+i+"'></div></div></a>");
I looks fine on the page, but when I look at googles cahced version of the site, the listing is not there and the page looks blank.

Web crawlers don't execute your JavaScript, so the <h1> tag isn't created. If you want this tag to be visible to web crawlers, you need to generate it with your serverside language.

What are you expecting? The "different seo tools" like the one you linked does not execute any javascript (usually). They work with the original state of your HTML.

Apostrophes in jquery/javascript string

I have the following code which appends an icon with an alert after the <a> tag :
$j("li[name='"+node_name+"'] > a").after('<a onmouseover="alert(\' expnote_from_db[n][0] \');" ><ins class="' + selected_class + '"> </ins></a>');
The code above works fine except that it displays exp_from_db[n][0] as a string inside the alert box.
So I changed it to the code below but nothing is displayed now
$j("li[name='"+node_name+"'] > a").after('<a onmouseover="alert(\'"'+ expnote_from_db[n][0] + '"\');" ><ins class="' + selected_class + '"> </ins></a>');
I don't understand where did I go wrong with the apostrophes.
I would appreciate your help regarding this. Thanks

This should work
$j('li[name="'+node_name+'"] > a')
.after('<a onmouseover="alert(\''+ expnote_from_db[n][0] + '\')" ><ins class="' + selected_class + '"> </ins></a>');

The " characters are delimiting the HTML attribute. You are terminating that attribute prematurely.
<a onmouseover="alert(\'"
Nesting JavaScript in HTML attributes is a pain.
Nesting JavaScript in HTML attributes in JavaScript strings is a bigger pain.
Don't do it. Apply event handlers using addEventListener and friends (since you are using jQuery that means using the on method which abstracts them).