Reading checked radio buttons, but not triggered by check

I have 2 different radio button fields sets name=top and name=bottom.

<div class="branch">
   <div class="element">
      <label for="top">top color:</label>
      <input type="radio" value="1" name="top" checked="checked">black
      <input type="radio" value="0" name="top">white
      <input type="radio" value="null" name="top">transparent
   </div>
   <div class="element">
      <label 开发者_开发百科for="bottom">bottom color:</label>
      <input type="radio" value="1" name="bottom">black
      <input type="radio" value="0" name="bottom" checked="checked">white
      <input type="radio" value="null" name="bottom">transparent
   </div>
</div>

I know how to detect the value of a radio button at the time it's selected and I reference $(this) to get the value that's just been selected. What I'm trying to do is trigger the reading when an unrelated button is clicked. I click another element (not the radio button itself) and at this point I want to read which value (black, white, transparent) is checked for name=top and name=bottom. How do I do this with jquery? I don't have reference to $(this) anymore. Do I need to loop through each input type radio option and check if it's checked? I hope someone can suggest a better way. In the example above, I want to read that the checked value for top color = 1 and the checked value for bottom color is 0

var topColor = $(".element input:checked").eq(0).val();

you could do:

var topVal = $("input[name=top]:checked").val();
var bottomVal = $("input[name=bottom]:checked").val();

example: http://jsfiddle.net/5vKxa/