jquery error in for loop with append

Question

I have a for loop nested in a for loop, where I'm trying to append some dynamically created elements, and I keep getting the error: 'Uncaught TypeError: undefined is not a function', and I'm not sure why. Here's what I have:

HTML:

<div class="particle"></div>

JS:

number_of_particles = 30 + Math.floor(Math.random() * 40);
number_of_layers =  3 + Math.floor(Math.random() * 5);
$particle = $(".particle");

for ( var i = 0; i < number_of_layers; i++ ) {
    var paralax_speed, $particle_layer, $particle_layer_particle;

    paralax_speed = Math.random().toFixed(2);
    $particle_layer = "<div class='particle-layer' data-stellar-ratio='" + paralax_speed + "'></div>";
    for ( var i = 0; i < number_of_particles; i++ ) {
        $particle_layer_particle = "<div class='particle'></div>";
        $particle_layer.append($particle_layer_particle);
    }
    $particle.append($particle_layer);
}

$particle_layer = $("<div class='particle-layer' data-stellar-ratio='" + paralax_speed + "'></div>"); should do it — axel.michel
– axel.michel, Commented Dec 28, 2014 at 18:53
micheal that worked, thank you, if you add it as an answer I'll accept. Just makes a Jquery object right? — loriensleafs
– loriensleafs, Commented Dec 28, 2014 at 18:55
Uhm, j .. no wait . .. k , or maybe l ... ouch, can't decide ! — adeneo
– adeneo, Commented Dec 28, 2014 at 18:57

beautifulcoder · Accepted Answer · 2014-12-28 18:56:43Z

2

You need a jQuery object:

$particle_layer = $("<div class='particle-layer' data-stellar-ratio='" + paralax_speed + "'></div>");

And two for-loops:

var i, j;
for (i = ...)
    for (j = ...)

answered Dec 28, 2014 at 18:56

beautifulcoder

11.4k3 gold badges21 silver badges31 bronze badges

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

3 Comments

loriensleafs Over a year ago

one more question, these are getting a style of display:none put on them for some reason, any idea why that's happening?

A. Wolff Over a year ago

@loriensleafs Ask new question, this is completly unrelevant to opened question. And don't forget to mark this answer as accepted one (and you can still upvote it btw)

beautifulcoder Over a year ago

Check your CSS, one quick way is through the F12 tools. @A. Wolff, I agree!

Collectives™ on Stack Overflow

jquery error in for loop with append

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related