NueveReinas

HTML

<form id="form" name="form" method="post">
    <div id="nuevo_campo" align="center"><p>Agregar Campos</p></div>
    <div id="campos"></div>
</form>

CSS

li {
    position:relative;
    margin-top:10px;
    margin-bottom:10px;
    list-style:none;
}

#nuevo_campo {
    background:#F1F1F1;
    border:1px solid #CCC;
    max-width:150px;
    cursor:pointer;
}

#nuevo_campo p {
    padding:10px;
    margin:0;
}

#campos {
    margin-top:40px;
    background:#F1F1F1;
    border:1px solid #CCC;
    max-width:500px;
    min-height:40px;
    padding:10px;
}

JavaScript

var nextinput = 0;

$("#nuevo_campo").click(function(e) {
    nextinput++;
    var campo = '<li id="rut'+nextinput+'">Campo: <input type="text" size="20" id="campo' + nextinput + '" name="campo' + nextinput + '"&nbsp; /></li>';
    $("#campos").append(campo);
});