We Keep Coding

Why does jQuery not seem to add text to nested spans?

I have tried this in a couple of different orders, and neither works. I start off like this:
var messageHtml = "<span class='message-bundle' id='" + randomId + "'></span>";
$(".visualizer").append(messageHtml);
randomId is a random number. Then I set the top and left positioning for the element (it is set to position: absolute).
Then I .append() the following empty spans to this span:
$(".message-bundle#" + randomId).append("<span class='usertag' id='" + randomId + "'></span><br/>" +
"<span class='message' id='" + randomId + "'></span>");
I keep them empty initially because I want to sanitize their contents against XSS exploits. So far, everything is fine. Then I add sanitized text to these nested spans.
$(".message-bundle .usertag#" + randomId).text(msgObj.usertag);
$(".message-bundle .message#" + randomId).text(msgObj.message);
This never works. I have tried printing out the .text() of these two elements, but they contain empty strings. Why is this? Can I somehow sanitize the strings and add them inline when creating the .usertag and .message spans above (instead of using .text())?

ids need to be unique throughout the entire document, and you’re duplicating them. It’s an inappropriate use of them anyway, though; you should work with elements more and HTML less.
var message =
$('<span>', { class: 'message-bundle' })
.append($('<span>', { class: 'usertag', text: msgObj.usertag }))
.append($('<span>', { class: 'message', text: msgObj.message }));
$('.visualizer').append(message);
This appends elements that you can manipulate as proper objects from the moment they’re created, rather than by re-selecting them after adding HTML.

IDs must be unique within the document - you're assigning the same ID to multiple elements. (Or is that just over-simplified code?)

Jquery append to PRE tag without quotes

JS fiddle example at http://jsfiddle.net/wR9P9/1/
In the HTML code of the example, I have two PRE tags. One defined as id=good which already has data populated. The 2nd PRE tag has id=bad. This tag does not have data defined, instead it is dynamically populated, for now in the javascript using append.
var testY = [0,1,2,3]
var testX = [0,1,2,3]
var testValue = [5,10,15,20,2,4,6,8,3,6,9,12,4,8,12,16]
$(document).ready(function() {
$(function () {
$.each(testY, function(k,v) {
$.each(testX, function(k2,v2) {
$.each(testValue, function(k3,v3) {
$("#bad").append(v + "," + v2 + "," + v3);
});
});
});
});
});
In line 197 of the javascript code, i can toggle between the good and bad pre tag ids to see the difference.
My problem is that when I use append, it is appending each element with double quotes that is causing my chart to break.
How can I append to the PRE tag without it including double quotes?
0,0,25 instead of "0,0,25"
Thanks in advance.

You chart gets created before you fill your pre-tag with data, because your data-creation is within (multiple) $(document).ready(function() { .. }) / $(function() { .. }). Solving that (commented out within the jsFiddle) will create a filled chart.
Besides that, you miss a new-line-character after your data, I've also added that one.
http://jsfiddle.net/wR9P9/5/

the above answer is what you need and this one too its all about playing with single and double quotes
wrap everything in single quotes and add double inside it
that should do it.
EXAMPLE:
$("#bad").append('"' + v + ',' + v2 + ',' + v3 + '"');

executing javascript inside href attribute of anchor tag

I checked a lot on Hrefs but couldn't get something related.
I am trying to do this in code behind which is actually a custom control class
writer.Write("<a href='javascript:document.location.href?" + filter.ParameterName + "=" + filter.QueryValue + "'>" + filter.UserVisibleValue + "</a>| ");
now this gets me something like this on hover of above anchor 'document.location.href?Test one=2013' and when i click it, this throws an obvious javascript error 'SyntaxError: missing : in conditional expression' because it takes it as a conditional operator and hence finds : missing.
I simply want that document.location.href (current url) should be calculated and the value put in where i use it.
I know that i may simply call a javascript function and inside that function i set the href but can i do it this way?

Try this:
writer.Write("<a href='javascript:window.location = document.location.href?" + filter.ParameterName + "=" + filter.QueryValue + "'>" + filter.UserVisibleValue + "</a>| ");
Note that you might have to escape values as needed otherwise JavaScript will become invalid. To prove that above approach works, you can copy-paste following simpler example in any HTML page and see it working:
bla

Javascript- Setting Input Value

EDIT: As this question turned out to be quite a bit different than originally stated, please refer instead to HTML- Altering Input Value
I have an input element that I am trying to set while I'm creating a pair of tables (the value should reflect the total value of the row). However, the statement is not working for some reason. The basics of the code are as follows:
prevTotalElt = $('#TimeSheetTable #ProjectData #projectBody #' + curProj + '_total');
alert(prevTotalElt.val() + '\n' + prevTotalVal);
prevTotalElt.val(prevTotalVal);
This code is in an if statement, and the alert message appears as expected with the proper values. The weirdest bit is that the same statement executes at the end of the loop (to take care of the final total element in the table) and works perfectly. I can't really understand what the issue is here, but any help would be appreciated.
EDIT: Due to requests, here is the line that creates the input element I am trying to set:
$('#TimeSheetTable #ProjectData #projectBody').html($('#TimeSheetTable #ProjectData #projectBody').html() +
'<tr><td align="center"><input id="' + curProj + '_total" type="number"' +
'align="center" value="' + tmpInd + '" style="width:17px; border:none;" disabled></td>');

Create Regex from a string variable in javascript

var tags=["div","span","body"];
for (i=0; i<=tags.length; i++){
source = source.replace(/\&lt\;<tags[i]/i, '<span class="tags[i]"><tags[i]</span>');
}
Basically, I'm trying to put all the opening div,span and body tags around a span with a class set accordingly. But, I am having issues getting the variables inside there.
I can put lines and lines for each different tag but considering this function is called on every key press I want to keep the code as small and efficient as possible.
Or are there other alternatives? I mean it would be even better if something along these lines was possible:
source = source.replace(/\&lt\;<div|<span/i, '<span class="div|span"><div|span</span>');
But, it clearly does not get me anywhere.

You can construct your regex from a string using the RegExp object:
source = source.replace(new RegExp("\\&lt\\;<" + tags[i], "i"), '<span class="' + tags[i] + '"><' + tags[i] + '</span>');
But your idea for an alternative is also possible by capturing the tag and referencing it in the replacement:
source = source.replace(/\&lt\;<(div|span|body)/i, '<span class="$1"><$1</span>');

You can use regexes with | (equivalent of OR): () are used to get the matched elements (div, span or body), and you can get them with $1
source.replace(/<(div|span|body)/i,'<span class="$1"><$1></span>')