Probleminha com div

Tenho este codigo que achei aqui no Forum que funciona perfeitamente. Mais me surgiu uma dúvida, teria como eu adicionar um novo campo e a MESMA div tbm altera o conteudo dele. Ou teria que criar uma div para cada campo? Com popup (carrega outro arquivo passando parametros) funciona legal, tentei a solução de carregar o popup na div, mais ai não consigo retornar o resultado para o campo.

Obrigado pela ajuda

<FORM name="meuForm">
<input type="text" name="txtRecurso" class="objForm"><br>
<input type="button" name="habilitar" value="buscar" onclick="showRecursos();"><br>

<div name="campos" id="campos" class="label" style="display:'none'; position:absolute; left:24px; top:80px; width:213px; height:111px; z-index:1; background-color: #F5f5f5;">
 Recurso<br>
 <select name="optRecurso" class="objForm">
 <option value="1">1- Non nom onom</option>
 <option value="2">2- Non nom onom</option>
 <option value="3">3- Non nom onom</option>
 <option value="4">4- Non nom onom</option>
 </select>

 <table border="0" cellspacing="0" cellpadding="0" align="right">
 <tr>
 <td valign="bottom"><img src="../../images/botoes/botao_salvar.gif" alt="salvar" onclick="confirmaOpcao();"></td>
 </tr>
 </table>

</div>
</form>

<script>
function confirmaOpcao () {
 document.getElementById("campos").style.display = 'none';
 document.meuForm.txtRecurso.value = document.meuForm.optRecurso[document.meuForm.optRecurso.selectedIndex].value;
}
function showRecursos() {
 document.getElementById("campos").style.display = 'block';
}
</script>