Phone Number Array

Greetings,

I have a simple cellphone dial pad graphic that I drew. There are 10 dial buttons (0 - 9) (movie clips btn1, btn2, btn3, etc) and a delete button. I also have a dynamic textbox (phone). Similar to a typical cellphone, as a number is dialed by "clicking" the number buttons, the phone number populates within the dynamic textbox (phone). Using Javascript to simulate the dialing, I have a function for each button process. When I press btn1 the number 1 shows correctly, however when I press btn2 (or any other button) the number replaces the previous number where only one number displays at a time. I want each number to fill in similar to that of a regular phone. Attached is a sample of my code.  Any help to fix..?

let root = this;

this.btn1.on("click", btn1F);
function btn1F () {
root.phone.text = 1;
};

this.btn2.on("click", btn2F);
function btn2F () {
root.phone.text = 2;
};

this.btn3.on("click", btn3F);
function btn3F () {
root.phone.text = 3;
};