<!DOCTYPE html> <html lang="ja-JP"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,user-scalable=yes,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.5"> <title></title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script> $(function(){ $(":radio").click(function(){ $("label").css("font-weight",""); $("label[for='" + $(this).attr("id") + "']").css("font-weight","bold"); }); $("label").click(function(){ $("label").css("font-weight",""); $(this).css("font-weight","bold") }); }); </script> <body> 性別: <input type="radio" name="gender" value="男性" id="gender_man"> <label for="gender_man">男性</label> <input type="radio" name="gender" value="女性" id="gender_woman"> <label for="gender_woman">女性</label> </body> </html>