jQuery Forum

I want to hide a map until it's needed, then when a button is clicked, load the map then scroll to it.

Here's my experiment/dev site: http://coventry.vip-news.co.uk/

Here's what I'm using:

1.  <div id="themap" class="themap c2">
2.     <br />
3.     <script type="text/javascript">
4.       $("button").click(function () {
5.       $("div.c2").fadeIn(1000).delay(1000);
6.       load();searchLocations();
7.       $("div.themap").delay(1000).animate({scrollTop:10}, 'slow'); return false;
8.       });
9. </script>

I've read lots of threads with similar problems, and none of their solutions seem to work.

I've tried:
$("themap")
$("div.c2")
$("dc2")
$('themap')
$('#themap')
in fact, every combination you can think of!

What DOES work is
$('html, body').delay(1000).animate({scrollTop:3000}, 'slow').delay(500);

But this isn't what I want, because the length of the page depends on the length of the playlist, so 3000 isn't the "right place".

I've also tried
$('html, themap').delay(1000).animate({scrollTop:3000}, 'slow').delay(500);

etc ad nauseum.

Where am I going wrong please?