javascript toggle divs problem

[esoteric]

Im trying to write a script so that upon clicking a link (which is a image in this case) it toggles a div displaying the necessary info below.

 

the javascript

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

$('.show_hide1').click(function(){
$(".slidingDiv1").slideToggle();
});
});
</script>

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

$('.show_hide2').click(function(){
$(".slidingDiv2").slideToggle();
});
});
</script>

 

snip from table

<tr>
          <td class="style1"> News </td>
          <td><a href="#" class="show_hide1"><img src="/img/add-icon.gif" width="16" height="16" alt="" /></a></td>
          <td><a href="#" class="show_hide2"><img src="img/hr.gif" width="16" height="16" alt="" /></a></td>
          <td><img src="img/edit-icon.gif" width="16" height="16" alt="" /></td>
          <td><img src="img/login-icon.gif" width="16" height="16" alt="" /></td>
          <td><img src="img/save-icon.gif" width="16" height="16" alt="save" /></td>
          <td><img src="img/add-icon.gif" width="16" height="16" alt="add" /></td>
</tr>

 

the content that will be displayed upon pressing the link

<div class="slidingDiv1"> 
<div id="admin_form">
  		<a href="#" class="show_hide1">Hide Form</a>
        form 1 test content
	</div>
</div>

 

Is it possible to hide all other divs when clicking a new link so only the relevant info is being shown?

 

Also is there a way to cut this code down a bit rather than creating x amount of function that all do the exact same thing but just show different divs? Im going to have at least 20 in total so it seems a lot of wasted code if there is a way to cut it down.