This is probably really simple but I cant seem to figure it out.

Code:
<div id="imgcontainer" class="imgcontainer">
<img onclick="makeActive(1)" class="active" src="images/demo_01.gif" alt="testimonial" />
<img onclick="makeActive(2)" src="images/demo_02.gif" alt="testimonial" />
<img onclick="makeActive(3)" src="images/demo_03.gif" alt="testimonial" />
<img onclick="makeActive(4)" src="images/demo_04.gif" alt="testimonial" />
<img onclick="makeActive(5)" src="images/demo_05.gif" alt="testimonial" />
<img onclick="makeActive(6)" src="images/demo_06.gif" alt="testimonial" />
</div>
<div class="show" id="imgdesc1">text1</div>
<div class="hidden" id="imgdesc2">text2</div>
<div class="hidden" id="imgdesc3">text3</div>
<div class="hidden" id="imgdesc4">text4</div>
<div class="hidden" id="imgdesc5">text5</div>
<div class="hidden" id="imgdesc6">text6</div>
Code JavaScript:
function makeActive(num){
//clear all image classes in imgcontainer div
//apply class active to clicked image (this.className = 'active';)
//show corresponding imgdesc div
}

When an image is clicked it should:
1) clear the classes of all of the images
2) assign the clicked image a class of "active"
3) I then want to show a corresponding text (which would be in the same function.

Thanks for helping!