検索／抽出（３）
クリックされたラジオボタンの側の枠内に色がつく

//.andSelf()を用いる場合
//$(':radio').click(function(ev) {
//    var on=ev.target.value;
//var off=(ev.target.value=='left')?'right':'left';
//$('div').find('.'+on).css('background-color','#cf9')
//      .andSelf().find('.'+off).css('background-color','transparent');
//} );
//$(':radio:first').click();

//.andSelf()を用いない場合
var on=ev.target.value;
var off=(ev.target.value=='left')?'right':'left';
$('div').find('.'+on).css('background-color','#cf9');
$('div').find('.'+off).css('background-color','transparent');

※


実行例
左 右
左
右
左
右

変更前のhtml
<form action="javascript:void(0);">
  <div>
      <input type="radio" name="square" value="left" />左
      <input type="radio" name="square" value="left" />右
  </div>
</form>
<div style="width : 230px">
     <div class="square left" style="float:left">左</div>
     <div class="square right" style="float:left">右</div>
     <div class="square left" style="float:left">左</div>
     <div class="square right" style="float:left">右</div>
</div>