Hi guys,

I have a jquery script for showing and hiding the content inside, between two divs, controlled with radiobuttons. I like to use the same jquery script for another group of divs and radiobuttons so I'm trying to create a loop are so inside jQuery.
Could somebody please help. Thx in advance.

<!----------------- my script ---------------------->

showhide.js

jQuery(function() {

$(document).ready(function(){
$("#div1").css("display","none"); // ol id
$('#div1 :input').attr('disabled', true);
$("#div2").css("display","none"); // ol id
$('#div2 :input').attr('disabled', true);



$(".controledivs").click(function(){
if ($('input[name=radiobtngroup1]:checked').val() == "1" ) {
$("#div1").slideDown("fast"); //Slide Down Effect
$('#div1 :input').removeAttr('disabled');
} else {
$("#div1").slideUp("fast"); //Slide Up Effect
$('#div1 :input').attr('disabled', true);
}

if ($('input[name=radiobtngroup1]:checked').val() == "2" ) {
$("#div2").slideDown("fast"); //Slide Down Effect
$('#div2 :input').removeAttr('disabled');
} else {
$("#div2").slideUp("fast"); //Slide Up Effect
$('#div2 :input').attr('disabled', true);
}

});
});

});

<!------------------- html --------------------------------->


<input name="radiobtngroup1" class="controledivs" type="radio" value="1" />
<input name="radiobtngroup1" class="controledivs" type="radio" value="2" />

<div id="div1">

content

</div>

<div id="div2">

content

</div>




<!------- What can I do to use the same above jQuery for the html below ----------------->


<input name="radiobtngroup2" class="controledivs" type="radio" value="3" />
<input name="radiobtngroup2" class="controledivs" type="radio" value="4" />

<div id="div3">

content

</div>

<div id="div4">

content

</div>