I'm currently using the bootstrap modal plugin to display long legal messages on a website I'm designing, but the problem is that if you open one modal after the other, the second one will already be scrolled to whatever position the first one was. So I'm looking for a way to scroll a div to the top with JS/JQuery. This is the code I'm using currently:

HTML:

<!--MODAL-->

<div id=modal class=modal hide fade tabindex=-1 role=dialog aria-labelledby=modalTitle aria-hidden=true>

<div class=modal-header>

<button type=button class=close data-dismiss=modal aria-hidden=true>×</button>

<h3 id=modalTitle></h3>

</div>

<div id=modal-content class=modal-body>

</div>

<div class=modal-footer>

<button id=modalPrint class=btn btn-info hidden-phone onClick=''>Print</button>

<button class=btn data-dismiss=modal aria-hidden=true>Close</button>

</div>

</div>

Javascript:

function openModal(heading, url) {

    $.ajax({

    url: url,

    cache: false

    }).done(function( html ) {

    $(#modal-content).html(html);

    $(#modalTitle).html(heading);

    $('#modalPrint').attr('onClick', 'loadPrintDocument(printCookies, {attr : href, url : '+ url +', showMessage: false, message: Please wait while we create your document})');

    $('#modal').modal('show');

    $(#modal-content).scrollTop(0);

    });

}

As you can see, I've tried scrolling to the top after the modal has been shown. Any ideas?