Populating a jQuery UI Dialog with a longish table, I would like to have it scroll to the last row in the table having a specific class. I found two other posts almost identical to this here, and here, but I can't get it to work. I've mocked it up at jsFiddle in the hope that someone might help me see the error in my thinking on it.
Here is the basic code
jQuery(document).ready(function() {
var content = jQuery('#amtz_div').html();
var title = 'Amortization Schedule';
var open = function() {
var container = jQuery(".ui-dialog");
var target = jQuery('tr.amortized:last');
container.scrollTop(target.offset().top - container.offset().top + container.scrollTop());
target.css('background', 'red');
}
jQuery("#dialog").attr('title', title).html(content).dialog({
modal: true,
width: 400,
height: 400,
resizable: false,
open: open
});
});
I also tried the scrollTo plugin (mentioned in one of the post linked above) but had now better luck with that.
Any thoughts?