asp.net ajax - Jquery scroll to element just goes to top of page -

i have jquery updates page content via ajax (paging through sub table content) , want page "jump" (scroll) top of section content has been updated. found code try , perform scroll ever goes right top of page , not specific element :

<script type="text/javascript">     $(document).ready(function() {         $(".page-number").on("click", function() {             var page = parseint($(this).html());             $.ajax({                 url: '@url.action("productreview")',                 datatype: 'html',                 data: {                     "id": @model.product.productid,                     "page": page                 },                 success: function (data) {                     $("#review-list").html(data);                     $("#page-number-"+ page).addclass("selected");                     //location.hash = "#prodreviews";                     scrolltoanchor("prodreviews");                 }             });         });         // scroll handler         var scrolltoanchor = function(id) {             // grab element scroll based on name             var elem = $("a[name='"+ id +"']");             // if didn't work, element our id             if (typeof(elem.offset()) === "undefined") {                 elem = $("#"+id);             }             //alert(elem.offset().top);             // if destination element exists             if (typeof(elem.offset()) !== "undefined") {                 // scroll                 $('html, body').animate({                     scrolltop: elem.offset().top                 }, 1000);             }         };     }); </script> 

this within asp.net mvc partial view reloads main razor view when paging links clicked - works fine. have following anchor near top of partial view :

<a name="prodreviews" id="prodreviews"></a> 

and paging links within same partial view :

<div class="pagewrapper"> @for (int = 1; <= model.reviews.numberofpages; i++) {     <a class="page-number" id="page-number-@i" href="javascript:void(0)">@i</a> } </div> 

is because anchor rendered again when ajax fires? tried moving main razor view jquery code didn't seem able find @ (despite fact should in dom?)

i can see when anchor in partial view , when alert un-remmed find element , return negative figure because it's offset currently? page trying scroll absolute point, rather want it?

demo — .animate() works fine.

make sure #prodreviews element exists on page, , give css styling can visually identify on page. additionally, if page contains floating elements above #prodreviews tag, ensure cleared.

open developer tools in web browser , check console other javascript errors, may preventing specific code running.