title: Adding each created object to parent object
body: <p>I have a function that takes user input and creates an object when a button is clicked. </p>
  
  <p>My current output.</p>
  
  <pre><code>{
    item   : "1",
    inputs : [
      {
        input : "1",
        input : "2",
        input : "3"
      }
    [
  }
  </code></pre>
  
  <p>What I am trying to do is for each time the button is clicked it creates the above object, while at the same time adding this object to another object.</p>
  
  <pre><code>{
    count   : 2,
    object  : [
      {
        item   : "1",
          inputs : [
            {
              input : "1",
              input : "2",
              input : "3"
            }
          [
        },
        {
          item   : "2",
          inputs : [
            {
              input : "1",
              input : "2",
              input : "3"
            }
          [
        }
      }
  </code></pre>
  
  <p>Does anyone have any way to accomplish this?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$('#clickMe').on('click', function() {
    var MyObj = []
    var inputs = $('[name="input[]"]').map(
      function() {
        return $(this).val();
      }).get();
  
    var length = inputs.length;
    data = []
  
    for (var i = 0; i &lt; length; i++) {
      var element = {
        "input": inputs[i]
      }
      data.push(element);
    }
  
    var item = {
      "item": $('#item').val(),
      "inputs": data
    }
    //console.log(item);
    MyObj.push(item);
    console.log(MyObj);
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;input id="item" value=""&gt;Item #
  &lt;br/&gt;
  &lt;br/&gt;
  &lt;input id="one" name="input[]" value=""&gt;
  &lt;input id="two" name="input[]" value=""&gt;
  &lt;input id="three" name="input[]" value=""&gt;
  &lt;br/&gt;
  &lt;button id="clickMe"&gt;
  Click Me
  &lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>