Pass data between 2 collections

help
1

I’m new in Meteor…I have 2 dropdowns menu each one in several collection.first one: client name in Customers collection. second: address in Addresses. So, when I choose the client name in first dropdown the address of this client should show in the next dropdown.

NOTICE: I use 2 other template to insert data in both dropdowns. I didn’t use any library & I use iron router.

template name="newOrder">
  <div class="title">
    <h2>New Orders: </h2>
    <input type="button" class="new" value="&plus; New Customer">
  </div>
  <form class="newOrder">
    <p>{{> selectClient}}</p>
  <p>Mobile number:<br> <input type="tel" class="Mobile" placeholder="Enter your mobile number.."
    required></p>
  <p>Products:<textarea rows="3" cols="35"></textarea></p>
  <p>Address: {{> selectAddress}}</p>
  <p>Date:   <input type="date" name="date" ></p>
  <p>Status:
    <select>
      <option>Pending</option>
      <option>Preparing</option>
      <option> Delivering</option>
    </select></p>
  <input type="button" name="create" class="done" value="Done">
</form>
</template>

<template name="selectClient">
  Client Name :
<select class="select">
  <option selected disabled>Choose client name</option>
  {{#each custom}}
  <option>{{clientName}}</option>
  {{/each}}
</select>
</template>
<template name="selectAddress">
  Address:
<select class="select" name="Choose the address">
  <option selected disabled>Choose the address</option>
  {{#each address}}
  <option>{{addressName}}</option>
  {{/each}}
</select>
</template>

main.js

Template.selectClient.helpers({
    'custom': function(){
        return Customers.find();
    }
  });
  Template.selectAddress.helpers({
    'address': function(){
        return Addresses.find();
    }
});