jquery - リンクの下をスライドトグル (またはリンクの下に表示/非表示) するにはどうすればよいですか?

Question

重複の可能性:
同じ場所でのスパンの表示/非表示

私がデザインしているこのウェブページをチェックしてください: http://www.mapisms.seas.gwu.edu/2.php

ここには 2 つのリンクがあり、それぞれをクリックすると、スパン タグが画面の左側に表示されます。しかし、それぞれのリンクの下に表示されるようにしたいです。

<script type="text/javascript">
$(document).ready(function(){
    $(".slidingDiv").hide();
    $(".show_hide").show();

    $('.show_hide').click(function(){
    $(".slidingDiv").slideToggle();
    return false;
    });

    $(".slidingDiv1").hide();
    $(".show_hide1").show();

    $('.show_hide1').click(function(){
    $(".slidingDiv1").slideToggle();
    return false;
    });

});
</script>

タグは次のとおりです。

<a href="#" class="show_hide">Japan</a><span class="slidingDiv"><img src="02-1 ImageFiles/01 Japan.JPG" style="width:235px; height:245px;" /><a href="#" class="show_hide">Close</a></span> is made up of islands, regions, prefectures (government districts), cities, and surrounding communities. The main island, Honshu, has thirty-four prefectures making up five regions. The <a class="show_hide1" href="#">Tōhoku Region</a><span class="slidingDiv1"><img src="02-1 ImageFiles/02 TohokuRegion.JPG" style="width:217px; height:236px;" /><a href="#" class="show_hide1">Close</a></span>