[jquey or js] funzione per aggiungere un nuovo elemento alla form

[orphenix]

come da titolo mi serve una funzione che aggiunge un nuovo elemento alla form se questo si verifica una condizione particolare ... premetto che sono neofita di js
ho cercato di arrangiare qualcosa, ma non sono giunto a nulla di buono. ho solo creato funzione semi funzionati che non reagivono a nessun evento.

io voglio realizzare una funzione js o jquery che aggiunge una nuova casella di text alla selezione di un opzione del radiobutton.
il codice scritto da me e il seguente:

<script type="text/javascript" src="js/jquery-ui-1.8.12/js/jquery-1.5.1.min.js" /></script>
<link rel="stylesheet" href="js/jquery-ui-1.8.12/css/ui-lightness/jquery-ui-1.8.12.custom.css" type="text/css" />
<script type="text/javascript" src="js/jquery-ui-1.8.12/js/jquery-ui-1.8.12.custom.min.js" ></script>
<script type="text/javascript" src="js/jquery-ui-1.8.12/js/calendario-it.js" ></script>
<script type="text/javascript">
    $(function() {
        $("#datapicher:input").datepicker({
            numberOfMonths : [1,1]
        });
     });
     function qualifica(){
         var blocco= $("qualifica: <input type=\"text\" name=\"qualifica\" >");
         blocco.append('#qualifica');    
     }
</script>
<form method="post" action="AddPersonaleServlet"> 

    Codice Fiscale: <input type="text" name="cf" value="" size="16"/>

    Nome: <input type="text" name="nome" value="" />

    Cognome: <input type="text" name="cognome" value="" />

    Indirizzo: <input type="text" name="indirzzo" value="" />

    Data Di nascita:<input id="datapicher" type="text" name="data_nascita" value="" readonly />

    Telefono: <input type="text" name="tel" value="" />

    Unsername: <input type="text" name="username" value="" />

    Password: <input type="password" name="password" value="" />

    Email: <input type="text" name="email" value="" />

    Amministratore <input type="radio" name="qualifica" value="admin" />  
    Cuoco <input type="radio" name="qualifica" value="cuoco" onclick="qualifica()"/>  
    Camerire <input type="radio" name="qualifica" value="cameriere" onclick="qualifica()"/>

    <div id="qualifica"></div>
    <input type="submit" value="Aggiungi" name="submit" />
    <input type="reset" value="Reset" name="reset" />
</form>

invece avevo creato un altra funzione tutta in js in questo modo:

<script type="text/javascript" src="js/jquery-ui-1.8.12/js/jquery-1.5.1.min.js" /></script>
<link rel="stylesheet" href="js/jquery-ui-1.8.12/css/ui-lightness/jquery-ui-1.8.12.custom.css" type="text/css" />
<script type="text/javascript" src="js/jquery-ui-1.8.12/js/jquery-ui-1.8.12.custom.min.js" ></script>
<script type="text/javascript" src="js/jquery-ui-1.8.12/js/calendario-it.js" ></script>
<script type="text/javascript">
    $(function() {
        $("#datapicher:input").datepicker({
            numberOfMonths : [1,1]
        });
  
var blocco= $("qualifica: <input type=\"text\" name=\"qualifica\" >");
    '.qualifica'.onclick(function(){         
         blocco.append('#qualifica');    
     });
   });
</script>
<form method="post" action="AddPersonaleServlet"> 

    Codice Fiscale: <input type="text" name="cf" value="" size="16"/>

    Nome: <input type="text" name="nome" value="" />

    Cognome: <input type="text" name="cognome" value="" />

    Indirizzo: <input type="text" name="indirzzo" value="" />

    Data Di nascita:<input id="datapicher" type="text" name="data_nascita" value="" readonly />

    Telefono: <input type="text" name="tel" value="" />

    Unsername: <input type="text" name="username" value="" />

    Password: <input type="password" name="password" value="" />

    Email: <input type="text" name="email" value="" />

    Amministratore <input type="radio" name="qualifica" value="admin" />  
    Cuoco <input type="radio" name="qualifica" value="cuoco" />  
    Camerire <input type="radio" name="qualifica" value="cameriere" />

    <div id="qualifica"></div>
    <input type="submit" value="Aggiungi" name="submit" />
    <input type="reset" value="Reset" name="reset" />
</form>

la stessa cosa questa..
questa invece la inserisce subito durante il caricamento

<script type="text/javascript" src="js/jquery-ui-1.8.12/js/jquery-1.5.1.min.js" /></script>
<link rel="stylesheet" href="js/jquery-ui-1.8.12/css/ui-lightness/jquery-ui-1.8.12.custom.css" type="text/css" />
<script type="text/javascript" src="js/jquery-ui-1.8.12/js/jquery-ui-1.8.12.custom.min.js" ></script>
<script type="text/javascript" src="js/jquery-ui-1.8.12/js/calendario-it.js" ></script>
<script type="text/javascript">
    $(function() {
        $("#datapicher:input").datepicker({
            numberOfMonths : [1,1]
        });
        
        
  
     var blocco_inserito = "";
    '.qualifica'.onSelect= $(function(){
        blocco_inserito=$("<div>

Benvenuto in jQueryItalia2</p></div>")
       blocco_inserito.appendTo("#qualifica");
    });
          });
</script>
<form method="post" action="AddPersonaleServlet"> 

    Codice Fiscale: <input type="text" name="cf" value="" size="16"/>

    Nome: <input type="text" name="nome" value="" />

    Cognome: <input type="text" name="cognome" value="" />

    Indirizzo: <input type="text" name="indirzzo" value="" />

    Data Di nascita:<input id="datapicher" type="text" name="data_nascita" value="" readonly />

    Telefono: <input type="text" name="tel" value="" />

    Unsername: <input type="text" name="username" value="" />

    Password: <input type="password" name="password" value="" />

    Email: <input type="text" name="email" value="" />

    Amministratore <input type="radio" name="qualifica" value="admin" />  
    Cuoco <input type="radio" name="qualifica" value="cuoco" />  
    Camerire <input type="radio" name="qualifica" value="cameriere" />

    <div id="qualifica"></div>
    <input type="submit" value="Aggiungi" name="submit" />
    <input type="reset" value="Reset" name="reset" />
</form>

[cavicchiandrea]

Se ho capito cosa vuoi fare prova cosi:

<script type="text/javascript">
    $(function() {
        $("#datapicher:input").datepicker({
            numberOfMonths : [1,1]
        });
$("input:radio").bind('click', function(){
		if($(this).val() == 'cameriere'){
		$("#qualifica").html("qualifica: <input type=\"text\" name=\"qualifica\" >")
		}else{
		$("#qualifica").html("")
}
		
	});
   });
</script>

[orphenix]

tnks andrea funziona ^^