Appending duplicate javascript object

Question

In the following code, I'm working on a simple timer in JS. The problem is that the resulting code only shows one set of divider colons.

var divider = $('<span>').addClass('divider').text(':');
stopwatchFace = stopwatchFace.append(timeHour).append(divider)
                             .append(timeMin).append(divider).append(timeSec);

Is there a reason why the first one isn't being picked up? Should I be explicitly defining a divider1 and a divider2 object?

You don't need to use chaining in this case. jQuery.fn.append() appends all parameters that it receives.. so you can use something like: stopwatchFace.append(timeHour, divider, timeMin, divider.clone(),timeSec); — fernandosavio
– fernandosavio, Commented Apr 11, 2013 at 19:51

Niet the Dark Absol · Accepted Answer · 2013-04-11 19:42:28Z

4

If you append an already-appended element, the result is that it is moved.

You need to clone the element. In vanilla JS, this would be as simple as divider.cloneNode(true).
In jQuery it's simple too: divider.clone(). Thanks Boaz for the info ^_^

answered Apr 11, 2013 at 19:42

Niet the Dark Absol

326k86 gold badges480 silver badges604 bronze badges

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

2 Comments

Boaz Over a year ago

The jQuery equivalent is the .clone() method.

Givi Over a year ago

@Kolink I have quite a strange question what is vanilla JS ? :)))

Anoop · Accepted Answer · 2013-04-11 19:42:51Z

2

Use need to clone divider. as divider is a dom single element cant exist two place at same time.

var divider = $('<span>').addClass('divider').text(':');
stopwatchFace = stopwatchFace.append(timeHour).append(divider.clone())
                             .append(timeMin).append(divider).append(timeSec);

answered Apr 11, 2013 at 19:42

Anoop

23.2k10 gold badges65 silver badges79 bronze badges

Collectives™ on Stack Overflow

Appending duplicate javascript object

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related