The password is copied to the hidden element onchange.
The hidden value is copied to the results element onclick of the display button.
Password >>

Result >>
A copy of the JavaScript functions in the head element:

// sample-1-form-functions.js
// This sample uses getElementById() to find the input areas
// The value from the password field is first copied to the hidden element
// and then copied to the result element

// reset validation function
// always returns true
function validate_reset()
  {
  alert("reset");
  return true;
  }

// display function
function display()
  {
  var hidden_area = document.getElementById("hidden_input");
  var result_area = document.getElementById("result");
  result_area.value = hidden_area.value;
  alert("display");
  }

// Reset values onload of the body
function loaded()
  {
  var input_area = document.getElementById("change-input");
  input_area.value = "";
  var result_area = document.getElementById("result");
  result_area.value = "";
  var hidden_area = document.getElementById("hidden_input");
  hidden_area.value = "";
  }

// input change event handler
// the data in the input area is put in the result area
function changeInput()
  {
  var input_area = document.getElementById("change-input");
  var hidden_area = document.getElementById("hidden_input");
  hidden_area.value = input_area.value;
  alert("changeInput");
  }