Properly append elements in for loop using jQuery

Question

Assuming that cache["s"].length = 9, and cache["n"] is an element in the DOM tree,

cache[ "c" ] = $("<div/>");
for( n = cache["s"].length; n >= 0; n-- ){cache["n"].append(cache["c"]); }

seems not working, and I have no clue, why. It appends the div element ONCE instead of 9 times.

However, if I say,

cache[ "c" ] = "<div/>";
for( n = cache["s"].length; n >= 0; n-- ){cache["n"].append(cache["c"]); }

it works, I get 9 elements, but they are not properly inserted into the DOM tree.

What is the problem, how could I solve it without losing speed?

Do you mean cache[n], no quote?

Karl-André Gagnon
– Karl-André Gagnon

2014-05-21 13:20:27 +00:00
Commented May 21, 2014 at 13:20 — Karl-André Gagnon
– Karl-André Gagnon, Commented May 21, 2014 at 13:20
Nope, "n" is the index in the cache array.

István Pálinkás
– István Pálinkás

2014-05-21 13:22:51 +00:00
Commented May 21, 2014 at 13:22 — István Pálinkás
– István Pálinkás, Commented May 21, 2014 at 13:22
Ok, the var name are not very intuitive :)

Karl-André Gagnon
– Karl-André Gagnon

2014-05-21 13:23:23 +00:00
Commented May 21, 2014 at 13:23 — Karl-André Gagnon
– Karl-André Gagnon, Commented May 21, 2014 at 13:23

Karl-André Gagnon · Accepted Answer · 2014-05-21 13:22:27Z

1

cache["c"] is a single element, which mean that when you append it over and over, it doesnt create a new div but take the old one and move it. Use .clone():

cache["n"].append(cache["c"].clone());

answered May 21, 2014 at 13:22

Karl-André Gagnon

33.9k5 gold badges53 silver badges77 bronze badges

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

Comments

Bhushan Kawadkar · Accepted Answer · 2014-05-21 13:22:43Z

1

 cache[ "c" ] = $("<div/>");

Here cache[ "c" ] is a instance of div element and if you try to apend it more than one time it replaces its instance.

But if use cache[ "c" ] = "<div/>"; then it is appending new div element each time.

If you want to use cache[ "c" ] = $("<div/>"); then try appending its clone everytime.

answered May 21, 2014 at 13:22

Bhushan Kawadkar

28.6k5 gold badges39 silver badges61 bronze badges

Collectives™ on Stack Overflow

Properly append elements in for loop using jQuery

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related