title: Merging objects from one array into another based on matching object values
body: <p>How can I use jQuery to merge the following two arrays on <code>child_array.cat_parent_id == parent_array.cat_id</code>?</p>
  
  <p>The parent_array:</p>
  
  <pre><code>[{
    "cat_name" : "Fruit",
    "cat_id" : 77
  }, {
    "cat_name" : "Vegetables",
    "cat_id" : 221
  }]
  </code></pre>
  
  <p>And the child_array which I'd like to have merged into parent_array:</p>
  
  <pre><code>[{
    "cat_name" : "Bananas",
    "cat_id" : 79,
    "cat_parent_id" : 77
  },{
    "cat_name" : "Apples",
    "cat_id" : 80,
    "cat_parent_id" : 77
  }, {
    "cat_name" : "Carrots",
    "cat_id" : 222,
    "cat_parent_id" : 221
  }]
  </code></pre>
  
  <p>Here's what I would like the output to look like:</p>
  
  <pre><code>[{
    "cat_name" : "Fruit",
    "cat_id" : 77,
    "cat_children": [
       {
         "cat_name" : "Bananas",
         "cat_id" : 79
       },
       {
         "cat_name" : "Apples",
         "cat_id" : 80
       }
    ]
  }, {
    "cat_name" : "Vegetables",
    "cat_id" : 221,
    "cat_children": [
       {
         "cat_name" : "Carrots",
         "cat_id" : 222
       }
    ]
  }]
  </code></pre>