Jquery Title drop down with other to be editable

Jquery Title drop down with other to be editable

HTML

<ul id="mainLink">
        <li><a href="#" class="dropdown" id="change">Title</a></li>
        <li class="sublinks"><a href="#">Mr</a> <a href="#">Mrs</a> <a href="#">Miss</a> <a
            href="#">Ms</a> <a href="#" id="other">Other</a> </li>
    </ul>

CSS

#change
        {
            height: 28px !important;
            background: #F8F8F8;
            background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F8F8F8), to(#EDEDED));
            background-image: -webkit-linear-gradient(top, #F8F8F8, #EDEDED);
            background-image: -moz-linear-gradient(top, #F8F8F8, #EDEDED);
            background-image: -ms-linear-gradient(top, #F8F8F8, #EDEDED);
            background-image: -o-linear-gradient(top, #F8F8F8, #EDEDED);
            color: #333;
            text-align: left;
            font-size: 1.2em;
            margin: 0;
            padding: 5px 45px 5px 5px;
            border: 1px solid #DDD !important;
            float: left;
            display: block;
        }
        #change:before
        {
            position: absolute;
            content: "";
            left: 49px;
            border-right: 1px solid #dedddd;
            height: 21px;
        }
        #change:after
        {
            top: 16px;
            border-color: #5a5959 transparent transparent;
            border-style: solid;
            border-width: 6px;
            content: "";
            display: block;
            height: 0;
            left: 58px;
            position: absolute;
            width: 0;
        }
        
        ul
        {
            clear: both;
            width: 84px;
        }
        ul li.sublinks
        {
            display: none;
            margin-top: 10px;
        }
        ul li:focus
        {
            -webkit-box-shadow: 0px 0px 4px 0px #CCC;
            -moz-box-shadow: 0px 0px 4px 0px #CCC;
            box-shadow: 0px 0px 4px 0px #CCC;
            color: #333;
            -webkit-transition: all 0.3s ease-out;
            -moz-transition: all 0.3s ease-out;
            -ms-transition: all 0.3s ease-out;
            -o-transition: all 0.3s ease-out;
            transition: all 0.3s ease-out;
        }
        ul li.sublinks a
        {
            width: 84px;
           ...

JavaScript

$(document).ready(function () {
            $('.dropdown').live('mouseenter', function () {
                $('.sublinks').stop(false, true).hide();

                var submenu = $(this).parent().next();

                submenu.css({
                    position: 'absolute',
                    top: $(this).offset().top + $(this).height() + 'px',
                    left: $(this).offset().left + 'px',
                    zIndex: 1000
                });

                submenu.stop().slideDown(300);

                submenu.mouseleave(function () {
                    $(this).slideUp(300);

                    $('a#other').focus(function () {
                        $('#change').blur();
                    });
                });
            });

            $('#tbOthers').live('keypress focusout', function (e) {
                var textTitle = $.trim($(this).val());
                if (e.type === 'keypress') {
                    if ((e.keyCode ? e.keyCode : e.which) === 13) {
                        if (textTitle.length === 0) {
                            $(this).replaceWith('<a href="#" class="dropdown" id="change">Title</a>');
                        }
                        else {
                            $(this).replaceWith('<a href="#" class="dropdown" id="change">' + textTitle + '</a>');
                        }
                    }
                } else if (e.type === 'keypress') {
                    if (textTitle.length === 0) {
                        $(this).replaceWith('<a href="#" class="dropdown" id="change">Title</a>');
                    }
                    else {
                        $(this).replaceWith('<a href="#" class="dropdown" id="change">' + textTitle + '</a>');
                    }
                }
            });

            $('#mainLink').find('.sublinks a').live('click', function (e) {
                var objChange = $('#mainLink').find('#change');
                if ($(this).attr('id') === 'other') {
            ...