Me parece que esto es lo que buscas:
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> Vipefy invisible </title>
<head>
</head>
<body>
<style>
.no {
display:none;
}
.si {
display:block;
}
</style>
<form action="<?=$_SERVER['PHP_SELF']?>" method="post" name="perfil" >
<input type="button" value="Nombre" id="nombre" onclick="javascript:nameformdiv.className='si';" /><br>
<input type="button" value="Correo electronico" id="mail" onclick="javascript:mailformdiv.className='si';" /><br>
<input type="button" value="Informacion adicional" id="opcional" onclick="javascript:opcionalformdiv.className='si';" />
<input type="hidden" value="" name="hidden" id="hidden" />
<div id="nameformdiv" class="no" >
<p>Nombre </p>
<p><input type="text" id="nameformdiv.name" class="input" /></p>
<p>Apellidos </p>
<p><input type="text" id="nameformdiv.surname" class="input" /></p>
</div>
<div id="mailformdiv" class="no" >
<p>Correo Electronico</p>
<p><input type="text" id="mailformdiv.correo" class="input" /></p>
</div>
<div id="opcionalformdiv" class="no" >
<p>Ciudad de residencia</p>
<p><input type="text" id="opcionalformdiv.ciudad" class="input" /></p>
</div>
</form>
</body>
</html>