Scroll to specific item in Checkbox List using jQuery

Hi have a Listview that I populate with alphabet letters. When a letter is clicked it looks for the first word in the checkbox list that starts with the alphabet letter. The value of the checkboxlist is then used as the parameter to which I have to scroll to.

I created a simple jsFiddle to test:

Checkbox list scroll to item

The fiddle is working fine. However, in my project I am getting the following error:

    0x800a138f - JavaScript runtime error: Unable to get property 'top' of undefined or null reference

This is what I did in code:

ASP.Net

    <div id="dialogEscalate" >
    <div id="MyDiv">
       <table>
        //other controls
        <tr>
            <td colspan="2">
                <asp:ListView ID="lvLetters" runat="server" DataKeyNames="Value" OnItemCommand="rpAlphabetList_ItemCommand">
                    <ItemTemplate>
                        <asp:LinkButton ID="lnkSelectAlphabet" runat="server" Text='<%#Eval("Value")%>' CommandArgument='<%#Eval("Value")%>' ></asp:LinkButton>                               
                    </ItemTemplate>
                    <ItemSeparatorTemplate>|</ItemSeparatorTemplate>
                    </asp:ListView>
                <br />
            </td>
        </tr>
        <tr>
            <td  style="vertical-align:top;">
                <asp:Label ID="Label5" runat="server" Text="Escalate To: "></asp:Label>
            </td>
            <td>
                <div id="escPersList" style="max-height:20px; height:200px; width:100%; min-width:400px; overflow-y:scroll;" >
                    <asp:CheckBoxList ID="chkEscalationList" CssClass="CheckBoxList" RepeatDirection="Horizontal" OnSelectedIndexChanged="chkEscalationList_SelectedIndexChanged"
                    RepeatColumns="1" runat="server">
                    </asp:CheckBoxList>
                </div>                   
            </td>
        </tr>
        //other controls
        </table>
    <div>
    <div>

C#: (Checkboxlist value:EmailAddress and Text: EmailAddress + Name

    private void GenerateAlphabets()
    {
        List<ListItem> alphabets = new List<ListItem>();
        ListItem alphabet = new ListItem();
       // alphabet.Value = "ALL";
        alphabet.Selected = alphabet.Value.Equals(ViewState["CurrentAlphabet"]);
        alphabets.Add(alphabet);
        for (int i = 65; i <= 90; i++)
        {
            alphabet = new ListItem();
            alphabet.Value = Char.ConvertFromUtf32(i);
            alphabet.Selected = alphabet.Value.Equals(ViewState["CurrentAlphabet"]);
            alphabets.Add(alphabet);
        }

        lvLetters.DataSource = alphabets;
        lvLetters.DataBind();
    }

This is when I click on the Alphabet letters:

    protected void rpAlphabetList_ItemCommand(object sender, ListViewCommandEventArgs e)
    {
        DataKey key = lvLetters.DataKeys[e.Item.DisplayIndex];
        string letterVal = (string)key["Value"];

        letterVal = letterVal.ToLower();

        foreach (ListItem li in chkEscalationList.Items)
        {
            string val = li.Value.ToString().ToLower().Trim();

            if (val.StartsWith(letterVal))
            {
                string sScript = "scrollToPerson('" + val + "');";
                ScriptManager.RegisterClientScriptBlock(this, typeof(System.Web.UI.Page), "focusScript", sScript, true);

                break;
            }
        }

    }

Then this is my jQuery:

    function scrollToPerson(word) {           
        var container = $('#MyDiv'),
        scrollTo = $('#"' + word + '"');

        container.animate({
            scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop()
        });

What am I doing wrong on code side?

------------ UPDATE ------------ After applying the below solution the scrolling isn't working. The value that is passed through code side is the email. Thus selecting T form the list the first value in the list it has to scroll to is t*****@soxsa.co.za. When looking at the "Insect page" from Chrome/IE the id of that specific control is different:

I'm only a beginner with jquery, but I think the issue for not scrolling is the value I send through and the element id is different?

The new jQuery script is as follows:

   function scrollToPerson(word) {           
        var container = $('#escPersList'),
        scrollTo = $("'#" + word + "'");
        container.animate({ scrollTop: scrollTo.top });
    }

i think this should work for you just fine unless if it's not exactly what u are aiming at

container.animate({scrollTop:$('#"' + word + '"').top});

or this should be what you needed. this for the page to scroll to that element

$('html, body').animate({scrollTop:$('#"' + word + '"').top})