jQuery creating and modifying elements

Question

I'm using an HTML snippet to insert some text into the element, then display it somewhere:

var elemTemp = $('<span /><strong class="value unit" />').find('span').text('hi!').end();
elemTemp.appendTo('#someDiv');

I want to insert "hi" inside the span but could not get it working. The find() method doesn't seem to find the span.

It looks like your selector is wrong: $('<span /><strong class="value unit" />') — Pangolin
– Pangolin, Commented Oct 7, 2011 at 12:53
Nideo, the selector is fine, it wraps span tags around the strong element and creates a jquery object out of that. — aziz punjani
– aziz punjani, Commented Oct 7, 2011 at 12:59

James Allardice · Accepted Answer · 2011-10-07 12:55:27Z

5

find looks down the DOM tree, but your span is not a descendant, so find won't find it. Use siblings instead:

var elemTemp = $('<span /><strong class="value unit" />').siblings('span').text('hi!').end();

Here's a working example. Note that this produces HTML along the lines of:

<span>hi!</span>
<strong class="value unit"></strong>

I'm not sure if you were aiming for that, or if you wanted the strong to be a child of the span.

answered Oct 7, 2011 at 12:55

James Allardice

166k22 gold badges335 silver badges316 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Hazard Over a year ago

Thanks, I exactly trying to do this and your solution is worked. I'm using the <span> as a label for <strong>, which looks like a disabled input area in my application.

Blazemonger · Accepted Answer · 2011-10-07 12:56:39Z

1

Why not do this as simply and quickly as possible?

 $('#someDiv').append('<span>hi!</span>'); // or whatever HTML you want in there

answered Oct 7, 2011 at 12:56

Blazemonger

93.3k28 gold badges147 silver badges181 bronze badges

1 Comment

Hazard Over a year ago

Thank you for the answer, but I included the elemTemp.appendTo('#someDiv'); line for simplicity. In actual application, this container element also creating programmatically by parsing some AJAX responses and some application logic. I want to append the elemTemp element while the container element is creating.

Marcus Olsson · Accepted Answer · 2011-10-07 12:57:55Z

0

You have to specify which span-tag you want to insert "hi" into. The easiest way is to set a class on the span-tag.

HTML:

<span class="hello"></span>

jQuery:

$('span.hello').html('hi');

answered Oct 7, 2011 at 12:57

Marcus Olsson

2,52719 silver badges37 bronze badges

Collectives™ on Stack Overflow

jQuery creating and modifying elements

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related