Merging arrays

[sitefinitysteve]

Have a look (attached)

So in the example, this is template 1

<script id="campus-template" type="text/x-kendo-template">

    <div class="campus-phase-block" data-bind="attr: {data-campusid: CampusID}">

        <h3 data-bind="text: Campus"></h3>

        <ul data-template="phase-template" data-bind="source: PhaseData" class="phaseBlocks">

             

        </ul>

        <div class="verbs">

            <h3>Available Actions</h3>

            <ul data-template="verb-template" data-bind="source: getVerbs" class="dynamic-list">

 

            </ul>

        </div>

         

    </div>

</script>

..and here's template 2:

<script id="verb-template" type="text/x-kendo-template">

        <li data-bind="click: onRunVerb">

            <span data-bind="text: text"></span>

        </li>

    </script>

So the populating of template 1 works fine, 3 items bound, 3 items displayed.  So template 2 however is supposed to return a list of verbs (getVerbs) based on the current ID of that item.

getVerbs: function (campus) {

//Figure out what phase the campus is in, and apply the right verbs

var dynamicItemVerbs = this.verbs[campus.Phase - 1].verbs

var commonVerbs = this.verbs[7].verbs; //The default items

/*

for (var i = 0; i < itemVerbs.length; i++) {

returnVerbs.push(itemVerbs[i]);

}

*/

var merge = $.merge(commonVerbs, dynamicItemVerbs);

return merge;

},

So debugging, it seems like $merge is appending the dynamic items to commonVerbs.  Does not making a varable off the "this.verbs[7].verbs" make a copy of that array?

What's the preferred way to do this instead?...serialize to JSON and back or something?