I have gotten this to work earlier, but for some reason it's no longer working. Could someone please explain me why this won't work now?
Page one that contains the iframe:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Test 1</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="thediv" style="background: #ffff00;"> div </div>
<iframe id="theframe" src="test2.html"></iframe>
</body>
</html>
the iframe content
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>test 2</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function () {
$("#clickme").click(function(){
$("#thediv", top.document).css("background","#ff0000");
alert($("#thediv", top.document).text());
});
});
</script>
</head>
<body>
<a href="#" id="clickme">clickme</a>
</body>
</html>