title: Set object key to dynamic value in JavaScript
body: <p>I'm looping through a jQuery selector and trying to assign values of form elements to a container variable that can then be passed along to further actions as JSON.</p>
  
  <p>Say there's three groups of checkboxes, each in their own div, named group1, group2 and group3.</p>
  
  <p>This is psuedo-code, but something like this:</p>
  
  <pre><code>var data = {};
  var groups = {
      'group1': obj with a bunch of key val pairs for checkboxes,
      'group2': another obj,
      'group3': and another obj
   }; // these define divs / groups of checkboxes
  
  // create all the checkboxes and divs from the groups object somewhere in here
  
  //now build a function to loop over the groups and get any checked boxes
  function getInputs(){
      $.each(groups, function(index, el) {
          // this is where I am stuck
          data.index = $('#' + index + ' input:checked'); // &lt;-- how to do this?
      });
  }
  </code></pre>
  
  <p>So essentially I want to add the values of the checked items to the proper item in the <code>data</code> object-- eg. If we're looping over the <code>group1</code> div, then the checkboxes for each group will be added to <code>data.group1</code>, <code>data.group2</code> etc.</p>
  
  <p>How do I make <code>data.index</code> evaluate as <code>data.group1</code>?</p>