在jQuery中获取元素返回的正确位置undefined

Question

我有这个包含导航菜单的HTML片段：

 <div class="inner-wraper clearfix">
            <ul class="root">
                <li ng-repeat="menu in menus" class="l_one selected">
                    <a href="#" title="{{menu.Title}}">{{menu.Title}}<span class="arr"></span></a>
                    <ul ng-show="getHasSubMenus(menu)" class="level sl">
                        <li ng-repeat="subMenu in menu.SubMenus" class="l_two">
                            <a ui-sref="site.shopbycategory({ departmentID: subMenu.DepartmentID , categoryID: subMenu.CategoryID, searchTerm: '' })" title="{{subMenu.Title}}">{{subMenu.Title}}</a>
                        </li>
                    </ul>
                </li>                  
            </ul>
        </div>

我想将子菜单与包含＆＃39; li＆＃39;的正确位置对齐。元素，我试过了：

var theright = $(this).position().right;

和

var theright = $(this).offset().right - $(this).parent().offset().right; 

和

var theright = $(this).css('right');

使用以下jquery代码，但我总是得到Undefined和NAN而不是数值。

$('.inner-wraper > ul').on('mouseenter', '> li', function (event) {

        var theright = $(this).position().right;
        //var theright = $(this).offset().right - $(this).parent().offset().right;                       
        //var theright = $(this).css('right');
        alert(theright);
        $(this).children('ul').css('right', theright);
    });

如何获得li元素的正确位置？