TextInput cursor automatically moves to front when it regains focus

TextInput cursor automatically moves to front when it regains focus

I'm getting this really weird behavior..
Here is a simplified version of my code:
DOWN = 40;
UP = 38;
$(document).on("keydown", "#text_input", function(e) {
if (e.keyCode == DOWN) {
$("#list").focus();
}
});
$(document).on("keydown", "#list", function(e) {
if (e.keyCode == UP) {
$("#text_input").focus();
}
});
So basically, if the user hits DOWN key while "#text_input" has focus, the
focus shifts to the "#list". In turn, when the user has focus on "#list"
and then hits UP key, "#text_input" regains its focus.
This works fine, EXCEPT the cursor in the "#text_input" automatically
moves to the front of the text value when it regains focus. I want to
prevent this so that the user can continue typing from where he left off
before switching focus to the "#list."
I searched on Stackoverflow to find a way to move the cursor to the end of
the text input, and found this solution:
$(document).on("focus", "#text_input", function() {
value = $("#text_input").val();
$("#text_input").val("");
$("#text_input").val(value);
});
This actually did move the cursor to the end ONLY WHEN I switched focus
using the Mouse event. For example, when I CLICKed on the blank part of
the page and then RECLICKed the "#text_input," the cursor did move to the
end of the input.
However, strangely enough, this does not work when I regain focus by using
my function, namely Pressing the DOWN key and then the UP key. The cursor
still moves to the front of the textfield.
Sorry for making the question confusing,, but this is the best I can do :((
Does anyone know why this is occurring and any possible solution??
Thanks!!!