Change Input Field Caret Position

Hello, I have an input field for phone number. I want to move the caret of the field based on the content. For example, when the user clicks/taps on the field, I want to move the position of the caret accordingly.

I tried on-tap and many more events, but nothing seems to satisfy my requirement. I tried a javascript function that uses element.select that is called with on-tap event but it works only on browser and not on the actual phone. I also tried the javascript select event but it looks like select event is not even getting called on phones. I am wondering if anyone accomplished something similar. Thanks.