Accessing array of objects (or array of arrays) in Javascript

Question

In my JavaScript I have an array of data stored in two ways

and

when I will output both arrays to the console I see all data which are correct.

Next I want to access them. For a first set of data I'm doing that:

  var total = data1.length;
      for (var j = 0; j < total; j++) {
        console.log(data1[j]);
      }

and then for second set of that

  var total = data2.length;
      for (var j = 0; j < total; j++) {
        console.log(data2[j].id + data2[j].gradient + data2[j].url);

      }

but if I want to use them (data from an object)

jQuery( "#' + data2[j].id + ' .banner-bg" ).css( "background-image",  data2[j].url );

it throws an error

Error: Syntax err or, unrecognized expression: # + data[j].id + .banner-bg

Where I have made a mistake?

Josh Beam · Accepted Answer · 2016-07-12 21:24:46Z

7

You're just escaping your quotes wrong. Do this:

jQuery( '#' + data2[j].id + ' .banner-bg' ).css( "background-image",  data2[j].url );

answered Jul 12, 2016 at 21:24

Josh Beam

19.9k5 gold badges48 silver badges69 bronze badges

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

Comments

AleshaOleg · Accepted Answer · 2016-07-12 21:25:05Z

1

Your argument for jQuery wrong. Try this:

var arg = '#' + data2[j].id + '.banner-bg';
jQuery(arg).css( "background-image",  data2[j].url );

answered Jul 12, 2016 at 21:25

AleshaOleg

2,2111 gold badge16 silver badges29 bronze badges

Sinan Guclu · Accepted Answer · 2016-07-12 21:26:35Z

0

This:

jQuery( "#' + data2[j].id + ' .banner-bg" ).css( "background-image",  data2[j].url );

Should be this:

jQuery( "#" + data2[j].id + " .banner-bg" ).css( "background-image",  data2[j].url );

In the first the whole string including the reference to the array object ( data2[j].id ) is being parsed by jQuery.