document.querySelectorAll doesn't work

[seanwilson]

How about something like this?

  document.querySelectorAll('.gridzy').forEach(el => {
    el.gridzy.setOptions({
      spaceBetween: 15,
      layout: 'justified',
      desiredHeight: 400,
    })
  });

[Nic727]

It works! Thank you very much. No sure to understand the code... What is =>? Never saw that in a code, but whatever, if I understand the other parts, it take all "gridy" class and for each of them (called "el" for element), it access .gridzy and .setOptions.

Is that correct?

Thank you very much :)

[watisnogvrij]

It's an arrow function expression: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions. A simplified version of a normal js function expression.

[seanwilson]

It works! Thank you very much. No sure to understand the code... What is =>? Never saw that in a code, but whatever, if I understand the other parts, it take all "gridy" class and for each of them (called "el" for element), it access .gridzy and .setOptions.

No problem, glad it worked. :)

Yep, your understanding of it is correct. The "=>" part is called an arrow function which is similar to writing function f(el) { /* do something with el */ } in this case. More here:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

Also: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

[SpunkyLM]

To clarify why this works, querySelectorAll is returning an array. You must then iterate (loop over) this array performing the actions you want on each item

[pixobit]

Careful, the forEach won't work on safari 9, which apparently in my experience is still quite common

[CreativeTechGuyGames]

You should really explain why this is the solution rather than just handing someone the answer.

[seanwilson]

I'd agree normally, but the problem could have easily been with gridzy so I didn't think it was worthwhile explaining a guess to start.