Change field value


I want to change the value of a field when another field is updated.

Specifically, I want my e mail field to get its data from the username,
the domain always being the same, so username is say johndoe, e mail
address will be [email protected]

my fields look like this:

<p><h3><label class="field" for="username">Username:</label></h3>
<%= f.text_field :username, :style => "width: 250px" %></p>

<p><h3><label class="field" for="email">Email Address:</label></h3>
<%= f.text_field  :email, :style => "width: 250px" %></p>

Very much a beginner with JavaScript incidentally so be gentle

Help is very much appreciated.