Merge two javascript objects without overwriting
<p>I have two javascript object with data like this:</p>

<pre><code>{
   "data": [
      {
         "foo": "2388163605_10150954953808606",
         "bar": {
            "xyz": "123",
         },
         "name": {
            "name": [
               {
                  "content": 1,
                  "data": "some text",
                  "id": "2388163605"
               }
            ]
         },
        },
        {
         "not_the_same": "other values",
         "foo": "different",
         "bar": {
            "xyz": "123",
         },
         "name": {
            "name": [
               {
                  "content": 1,
                  "data": "some text",
                  "id": "2388163605"
               }
            ]
         },
        }]
}
</code></pre>

<p>Second one:</p>

<pre><code>{
   "data": [
      {
         "foo": "123+09",
         "bar": {
            "xyz": "1adad0",
         },
        },
      }]
}
</code></pre>

<p>as you can see, the properties etc vary a bit, and of course the values as well. Also they don't have the same number of items in them. I'm trying to merge them like this:</p>

<pre><code>$.extend(true,posts, posts_object);
</code></pre>

<p>(posts and posts_objects contain the two objects)</p>

<p>I want to merge them into this:</p>

<pre><code>{
   "data": [
      {
         "foo": "2388163605_10150954953808606",
         "bar": {
            "xyz": "123",
         },
         "name": {
            "name": [
               {
                  "content": 1,
                  "data": "some text",
                  "id": "2388163605"
               }
            ]
         },
        },
        {
         "not_the_same": "other values",
         "foo": "different",
         "bar": {
            "xyz": "123",
         },
         "name": {
            "name": [
               {
                  "content": 1,
                  "data": "some text",
                  "id": "2388163605"
               }
            ]
         },
        },
      {
         "foo": "123+09",
         "bar": {
            "xyz": "1adad0",
         },
        },
      }]
}
</code></pre>

<p>However, this results in the data from the second object to overwrite the data of the first object. Is there any way to merge them but instead add the items from the second object to the first object?</p>
