Javascript/Jquery simple user experience functions

I am starting to write some javascript for my site to create a better user experience but i am getting a little confused on what exactly is happening, and maybe it is clearly evident to someone else what I am doing wrong or missing. I have two javascript functions that work perfect after the first time of use and if you use it slowly (sometimes it skips the next item and selects nothing if you press a key too fast). I feel that I am missing some sort of $(document).ready(function() {}); implementation to make sure that each process has finished before it moves on. I have two textboxes that the user puts in two numbers then it moves on to the next tab element (the next textbox). The textboxes are also in an asp.net update panel if that has any impact.

    function selectall(item) {
             $(item).focus().select();
     };
 
     function selectNext(textBox) {
         if ($(textBox).val().length == 2) {
             $(textBox).next().focus().select();
         }
     };
 
         <asp:TextBox ID="Text1" runat="server" Width="30px" AutoPostBack="True"  onkeyup="selectNext(this);" onclick="selectall(this);"
     Height="20px"></asp:TextBox>:
                 <asp:TextBox ID="Text2" runat="server" Width="30px" AutoPostBack="True" onkeyup="selectNext(this);" onclick="selectall(this);"
     Height="20px"></asp:TextBox>
                  <asp:DropDownList ID="Text2" runat="server"
 

---