can't find "this" in jquery overlay
New to jquery and using the overlay tools in jquery-1.2.7.tools.min.js. I have several div's set up as overlays on an 'img' and some 'a' tags.
<img src="/image/test.png" rel="#1485">
<div id="1485" class="simple_overlay">
<a rel="1486">1</a>
<a rel="1487">2</a>
<a rel="1488">3</a>
<div id="1486" class="simple_overlay">
<a rel="1486">1</a>
<a rel="1487">2</a>
<a rel="1488">3</a>
<div id="1487" class="simple_overlay">
<a rel="1486">1</a>
<a rel="1487">2</a>
<a rel="1488">3</a>
When I click on one of the 'a' links, I want the overlay div matching its id to be shown, and the others to be hidden. But, in using jquery code like this:
<script>
$(document).ready(function () {
$('img[rel]').overlay({
oneInstance: false
});
$('a[rel]').overlay({
oneInstance: false,
onLoad: function (event) {
$('.simple_overlay').not($(this)).hide();
}
});
});
</script>
or in using this:
$(this).siblings().hide()
the "this" designation does not do what I want. Essentially, all divs with class .simple_overlay are hidden on the hide() call. I want the div with the clicked rel id to be shown, and the others hidden, but it seems I'm mistaking what "this" is...Can anyone tell me how to do this?