Iterating over variable with jQuery not working

Question

I set this variable at the top of my page setVars = {"n":"2","m":"1","degree":"3","p":"2"}

I want to iterate over each of the elements in setVars but jquery's each() function isn't working.

Here's what I have -

$(setVars).each(function(key, value) {
  elementId = '#' + key+ '-wrapper';
}

But key is set to 0 here on the first iteration and value is set to the full setVars object here for some reason. It doesn't make it to a second iteration, it breaks when I step through it and try to go to the second iteration.

Answer 1

It should be like that I belive according to this http://api.jquery.com/jQuery.each/

$.each(setVars, function(key, value) {
  elementId = '#' + key+ '-wrapper';
});

setVars is not a collection of DOM elements, it is an object

Answer 2

You are using .each() that's meant for iterating through jQuery objects instead of $.each() that's meant for iterating through objects and arrays . Try this:

$.each( setVars, function(key, value) {
  elementId = '#' + key+ '-wrapper';
});

Answer 3

you don't need JQuery for this. Also I could be wrong but you don't want the quotes around the name of the object properties you never see that:

setVars = {n:"2",m:"1",degree:"3",p:"2"}

And

for(i in setVars){
   console.log("key: ",i," value: ", setVars[i]); // demonstration of how to access key and value
   elementId = '#' + i + '-wrapper';
}