Opening pages with Ajax

Opening pages with Ajax

Hello,
Please, can you help me? I'm in a hurry...
I have a main page (gallery.asp, Ex.1) that loads, via jQuery ajax, another page (picture.asp, Ex.2)

It's all fine when I first open the "gallery.asp" page: the "picture.asp" page loads into the "test" div with the first record I want ('cause of the snippet marked as "// load first picture onLoad")

In my idea, clicking on the "#next" and "#prev" link (that, please notice, are in the "picture.asp" page - so they are ajax-loaded) should load "/picture.asp?iData=<%= nextRecord %>" and "/picture.asp?iData=<%= prevRecord %>" into "test" div respectively

But of course, nothing happens (no "next" or "prev" page is loaded, and I get no errors)
Please, where am I wrong? Is there a workaround for this?

Thanks

Ex.1
  1. <div id="test"></div>
    ...
    $(document).ready(function(){
    // load first picture onLoad
    $("#test").load("/picture.asp?iData=1");

    // load next picture when clicking on "#next" link
    $('#next').click(function(event){
    event.preventDefault(); // don't open the page
    $("#test").load($('#next').attr('href')); // load it!
    });

    // load prev picture when clicking on "#prev" link
    $('#prev').click(function(event){
    event.preventDefault(); // don't open the page
    $("#test").load($('#prev').attr('href')); // load it!
    });
    });
















Ex.2
  1. <img src="<%= rs.("Picture") %>" />
    <a href="/picture.asp?iData=<%= prevRecord %>" id="prev">Previous</a>
    <a href="/picture.asp?iData=<%= nextRecord %>" id="next">Next</a>