Second text overlays the first in Textbox using TextMesh Pro

During some testing I wrote text to a textbox and then I want to replace that text with another and I get the second set of text on top of the first.
It is working perfectly in Scene view but in the game view it overlays.

Code (CSharp):

1.    
2. private void Start()
3.     {
4.         sb  = new StringBuilder(15);
5.         StartCoroutine("FirstMessage");
6.         StartCoroutine("SecondMessage");
7.     }
8.  
9.  
10.     //do start coroutines to set text
11.  
12.  
13.     IEnumerator FirstMessage()
14.     {
15.         yield return new WaitForSeconds(2f);
16.        // equationArea.SetText("First Message");
17.         equationArea.text = "FirstMessage";
18.     }
19.  
20.     IEnumerator SecondMessage()
21.     {
22.         yield return new WaitForSeconds(5f);
23.         equationArea.text = "Second Message";
24.  
25.     }

 

I was able to find a workaround.
The solution was to make the text object a child of an image object.