We are developing a MVC web app that will us Jquery mobile for tablets and phone. And are experiencing a odd behavior.  The page I'm working on has a Select menu. When the user selects an item from this menu it fires a function to load the contents of a Div on the same path with a UL that becomes a listview. This parts work fine. However, after this ListView is display the select is repainted an it looks like its nesting the select menu

Picture OnLoad.png is what it looks like when it loads

Picture aferselect.png is what it looks like after if fills the list view

I know I'm doing something wrong, but I'm at a loss to know what that is. I looks as though the entire page is getting reloaded instead of just filling the listview.

My function that dynamically fills the listview is fairly simple

 function onDropDownSelect(sender, args)
    {
       var tblName = "by"+ $("#ParentType").val();
       var url = '@Url.Action("ParentView", "Browse")';
        var idx = $("#ParentType").prop('selectedIndex');
        $.get(url, { key: tblName }, function (data, status) {
            $('#ParentTree').html(data);  // this is the line that causes the select to start cascading
            $('#ParentTree').listview();
        });
    }

If I comment the bolded line above, or if I don't add these lines to the ParentView.Tablet.cshtm file

        @Styles.Render("~/Content/MobileCSS")
        @Scripts.Render("~/bundles/modernizr")
        @Scripts.Render("~/bundles/MobileJS")

The select behaves normally. If I don't include the above @ line then I just get an Unnumbered list instead of a listview.

The project is being created in VS 2012. I can show additional code sample if you need.

Thanks in advance.