Hi all this is my first post! I'm searching for the past two days for a solution. and many times google results linked to this website. but i couldnt get a reasonable solution so i'm asking here 'once' again.

heres the problem
there is a main page, lets say main.html. from there u can click a link (a href) to login (login.html), after validating the page is redirected to main.html and there I want to change the 'login' link to 'logout'

main.html
----------
HTML Code:
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <link rel="stylesheet" type="text/css" href="../../../style1.css">
      <script language="JavaScript" src="../../../script.js" type="text/javascript"></script></head>
   <body onLoad="window.focus();">
      <h1>Data Base Systems</h1>
      <div id="login"><a href="../login.html">Login</a></div>
   </body>
</html>
login.html
----------
HTML Code:
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   
      <link rel="stylesheet" type="text/css" href="../../style1.css"><script language="JavaScript" src="../../script.js" type="text/javascript"></script></head>
   <body onLoad="document.frmLogin.txtUsername.focus();">
      <form method="post" name="frmLogin">
         <h1>Login</h1>
         <table>
            <tr>
               <td>Username: </td>
               <td><input type="text" id="txtUsername" name="txtUsername"></td>
            </tr>
            <tr>
               <td>Password: </td>
               <td><input type="password" id="txtPassword" name="txtPassword"></td>
            </tr>
            <tr>
               <td><input type="button" value="Login" onClick="logIn();"></td>
               <td>&nbsp;</td>
            </tr>
         </table>
      </form>
   </body>
</html>
script.js
--------
HTML Code:
function logIn() {
	// get the courseid value from URL parameter to know for which course the user is logged in
	var courseid = getParamValue('courseid');
	courseid = courseid.toLowerCase();
	// get form element values 'txtUsername' and 'txtPassword'
	username = document.frmLogin.txtUsername.value;
	username = username.toLowerCase();
	password = document.frmLogin.txtPassword.value;
	password = password.toLowerCase();
	// <-- here comes the validation
            if(loggedIn) {
               var newwin = window.open(courseid+"/summary.html","_self");
               if(window.focus) {newwin.focus()}
               newwin.document.getElementById("login").innerHTML = 'Logout'; // [COLOR="Red"]<-- this isnt working[/COLOR]
            }
I'm using IE7. Didnt work in firefox either.

What all I tried:

- instead of var newwin = window.open(courseid+"/summary.html","_self");, i tried var newwin = self.location.replace(courseid+"/summary.html");
- tried newwin.onload = function () {
setTimeout('location.reload()',1000); //<- donno which function I should call inside setTimeout
}
- tried windows.opener method. got this code somewhere online
HTML Code:
var WindowRef = null;
function openWindow(url, name, props) {
	if(@cc_on!@false){ //do this only in IE    
		var WindowRef = window.open("", name, props);
		WindowRef.close();  
	}
	var WindowRef = window.open(url, name, props);
	if (!WindowRef.opener) {
		WindowRef.opener = self;
	}
	WindowRef.focus();
	return WindowRef;
}
and calling var newwin = openWindow(courseid+"/summary.html","_self","");

what worked:
it still can call newwin.document.getElementById("txtUsername").value means it still could checkelements in login.html

Thank you for any help.