iFrame and Javascript actions

I'll post my code below. My goal is to grab the selected text in an
iFrame from javascript (really any way possible). When I highlight
text in the iFrame and click the link outside of the iFrame, I receive
the following error:

Firefox FireBug Error
uncaught exception: Permission denied to get property
HTMLDocument.getSelection

IE7 Error
Error: Access Denied.
Line: 25



If you have any idea what is going wrong, then I urge you to reply to
my post. If you have another way to do what way, then I also urge you
to reply. Thank you very much for taking the time to read through my
post.



<html>
<head>
<title>Title of page</title>

<!-- Include CSS Files -->
<link rel="style***" href="style.css" />

<!-- Include JS Files -->
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="mootools.v1.00.js"></script>

<script>
function showFxTarget(target) {
$(target).makeDraggable();
$(target).setStyles({
'display': 'block',
'visibility':'visible'
});

if (document.getSelection) {
var iframe = window.frames.groups;
var str = iframe.document.getSelection();
} else if (document.selection && document.selection.createRange) {
var iframe = window.frames.groups;
var range = iframe.document.selection.createRange();
var str = range.text;
} else {
var str = "Error: Could not find the selected text.";
}

}
</script>
</head>
<body>
<h2>A draggable box</h2>
<div id="firstFXT" class="fxTarget"></div>
<p>Click <a href="javascript:showFxTarget('firstFXT');">here</a>to
make the box appear.</p>
<iframe name="groups" frameborder="0" src ="http://groups.google.com/";
width="80%">
<div id="firstFXT" class="fxTarget"></div>
</iframe>
</html>

.

Loading