how to create radio button with images

I want to have a radio button with images instead of text. So I want to have an image of male and female instead of a text of male and female. Can this actually be done using a standard HTML or do I have to use jQue开发者_StackOverflow中文版ry? How do I do this?

Use <label> elements to host your images, like this:

<input type="radio" name="sex" value="male" id="male-radio">
<label for="male-radio"><img src="male.gif"></label>

<input type="radio" name="sex" value="female" id="female-radio">
<label for="female-radio"><img src="female.gif"></label>

Working example: http://jsfiddle.net/RichieHindle/vQwCF/