How to scroll to an anchor inside <div> with html loaded via .load() jQuery method?

How to scroll to an anchor inside <div> with html loaded via .load() jQuery method?

I have found many answers on stackoverflow to a similar (but actually much easier) question of how to scroll to a given anchor in the main body. This is easy:

  1. var off = $('#id').offset().top;
  2. $(body).scrollTop(off);

However, in my case the situation is more complex. Imagine a <div> (with id of 'col1txt') in the main body which has html loaded into it via .load() method like this:

  1. $('#col1txt').load('text.html');

Now this 'text.html' has an anchor <a id='id'></a> and if I point the browser to 'text.html#id' then it jumps to the correct position. But I need to do the same programmatically, i.e. scroll to it via $('#col1txt').scrollTop(). But how to calculate the offset to be passed to .scrollTop() method?

Oh btw, does .load() link the text into the global DOM tree? Hmmm, in that case I must ensure that its ids are unique, i.e. don't conflict with the ones loaded into other divs, right?