Show and Hide Text - how do I do that?

[Love2Java]

Is there a simple way, through the use of the onclick event, to show and hide text? I don't want to use a <div> unless completely necessary.
Basically I have a form, and it contains username and password text fields, depending on which <radio> button is hit, the username/password fields will be disabled (already coded that part) and I also want the red * next to these fields to disappear, so the user further realizes that the username/password fields don't need to be filled in.

Is there a quick way to do this with the onclick() event in javascript?

I know, I know...I really need to learn javascript already

[spinal007]

You don;t necesserally need a div, but you'll need a paragraph/fieldset/span or something to wrapt the elements you want to show/hide.

Anyway, I'll point you in the right direction: jQuery.
I have not tested the following, I just typed it as I went along...
But that's the basic idea:

HTML: Select all

<form action="login.asp">
<input type='radio' name='mode' id='by-username' /> By Username - 
<input type='radio' name='mode' id='by-password' /> By Password
<br/>
 
Username/password: 
<input type='text' id='username' name='username' value='username' />
<input type='text' id='email' name='email' value='password' style='display:none;' />
<br/>
 
Password: <input type='text' id='password' name='password' />
</form>

Code: Select all

<script>
$(function(){
$('#by-username').click(function(){
$('#username).show();
$('#email).hide();
}
$('#by-email').click(function(){
$('#username).hide();
$('#email).show();
}
})
</script>