Return two variables to view(solved)

Hello, if anyone knows how to do this, i’d truly appreciate the help.

I have a team generating app that i’m creating which will split a single collection up into a red and a blue team. I’ve got the split to work fine, but i’m having trouble figuring a way to return them both to a single view (Blue on the left and Red on the right)

My html and CSS is all setup properly in my view(using blaze), Just need to know the best way to pass the red and blue variable to the view and iterate through them. Here is my code. Thank you in advance.

Template.kiosk.helpers({
teams() {
 //find checked in player of game 
  var ckPlayers = PlayersOnDeck.find( { }, { name: 1 } ).fetch();

  //shuffle ckPlayers object
  var shuffle =  _.shuffle(ckPlayers);

  //get count of shuffled list
  var count =   shuffle.length;
  //set splice at half of count

  //find the middle of the returned collection
  var  middle = count/2;

  //splice up collection to create blue team
  blue = shuffle.splice(0, Math.floor(middle));
  //red is the rest of the splice
  red = shuffle;

return blue;
return red;  //i know i can't return them both like this, but what is the best way?
}
});//end helpers

html code

  <!-- 			Team displays -->
      <div class="col-md-6" id="blueTeam">
        <h2> Blue Team </h2>
       {{#each teams}}
          <div id="blue" class="pl">  {{name}}</div>
          {{/each}}
      </div>

      <div class="col-md-6" id="redTeam">
        <h2>Red Team</h2>
        {{#each teams}}
           <div id="red" class="pl">  {{name}}</div>
           {{/each}}
      </div>
Template.kiosk.helpers({
  teams() {
   var teams = {};
   //find checked in player of game 
   var ckPlayers = PlayersOnDeck.find( { }, { name: 1 } ).fetch();
   //shuffle ckPlayers object
   var shuffle =  _.shuffle(ckPlayers);
   //get count of shuffled list
   var count =   shuffle.length;
   //set splice at half of count
   //find the middle of the returned collection
   var  middle = count/2;
   //splice up collection to create blue team
   teams.blue = shuffle.splice(0, Math.floor(middle));
   //red is the rest of the splice
   teams.red = shuffle;
  
   return teams;
}
});
<!-- Team displays -->
<div class="col-md-6" id="blueTeam">
  <h2>Blue Team</h2>
  {{#each teams.blue}}
    <div id="blue" class="pl">  {{name}}</div>
  {{/each}}
</div>

<div class="col-md-6" id="redTeam">
  <h2>RedTeam</h2>
  {{#each teams.red}}
    <div id="red" class="pl">  {{name}}</div>
  {{/each}}
</div>

thank you so much. worked like a charm.