如何用javascript / css3点击轴周围的旋转动画？

Assume that I have a div of a rectangular box that is red with white text on it. I want to make it so that when I click on it, it animates with rotation in a 3D way (using CSS3?) and shows different text on it. (i.e. kind of like if you were looking at a flashcard with the letter "A" on it, and flipping it over to see the letter "B" on the other side).Assume that I have a div of a rectangular box t