Particles.js: Applying particles-js to div through class selector?

[Kinnardian]

Applying particle-js as a .class instead of as an #id does not seem to work.

<div id='realID' class='row particle-js'>
    A bunch more html . . .
    . . .
</div>

I figured I'd just ask before digging.

[FlixFlix]

You can edit the very first line inside the function:
change var canvas_el = document.querySelector( '#' + tag_id + ' > .particles-js-canvas-el' );
to var canvas_el = document.querySelector( tag_id + ' > .particles-js-canvas-el' );
as well as two other occurrences of document.getElementById( tag_id ); to document.querySelector( tag_id );

You can then pass IDs or classes, just make sure you add the hash or dot, respectively. Also keep in mind that only the first matching element will be filled with particles, so if you need more than one canvas, you need to use unique class names.

[saitaosla]

Tried it but seems to be not working, did it work for the TS?

Update:
It worked! just don't forget to include a (.) sign on the settings
particlesJS('.particles-js',

[FlixFlix]

Works for me. Did you replace the other two occurences? Also make sure to pass the CSS class name including the "dot", or if using an ID, the "hash" symbol.

[saitaosla]

Yes, thanks for the hard work!

[carlosnpz]

Didn't work for me...
Uncaught ReferenceError: Stats is not defined

[firestar300]

The best way is to use a loop something like that :

```javascript
$('.js-particle').each(function (e) {
$(this).attr('id', 'particle-' + e)

particlesJS.load('particle-' + e, path.resolve(__dirname, 'assets/js/vendor/particlesjs-config.json'))
})

[garbinmarcelo]

any news?

[mateostabio]

None of the above seem to work for me. I need the header and the footer to have particles-js

[tittokvarghese]

Thanks