campos dinâmicos

Boa noite pessoal!

Estou desenvolvendo um sistema em php e mysql. Neste sistema tenho a parte de cadastro de funcionários e, uma das áreas é a inclusão de dependentes. Como o número de dependentes pode variar, coloquei uma função em jquery para inserir ou remover campos dinamicamente.

O código está abaixo:

php:

$tabIndex = 1;

echo "<div class='campoFormulario'>";
echo "<div class='campo'>";
echo "Dependentes";
echo "</div> <!-- Fim da div campo -->";
echo "<div class='valor'>";

echo "<div class='blocoDependentes'>";
echo "<div class='colunaNomeDependente'>";
echo "Nome <input type='text' name='nomeDependente[]' class='textBoxDependente' maxlength='120' value='' tabindex='" . $tabIndex . "' />";
$tabIndex++;
echo "</div> <!-- Fim da div colunaNomeDependente -->";

echo "<select name='parentescoDependente[]' class='comboParentescoDependente' tabindex='" . $tabIndex . "'>";
echo "<option value='0' selected='selected'>parentesco</option>";
echo "<option value='1'>irmão(ã)</option>";
echo "<option value='2'>tio(a)</option>";
echo "<option value='3'>primo(a)</option>";
echo "<option value='4'>sobrinho(a)</option>";
echo "<option value='5'>avô(ó)</option>";
echo "</select>";
$tabIndex++;

echo "<div class='colunaDataNascimentoDependente'>";

echo "Nascimento <input type='text' name='nascimentoDependente[]' class='textBoxDataNascimentoDependente' maxlength='10' value='' tabindex='" . $tabIndex . "' />";
$tabIndex++;
echo "</div> <!-- Fim da div colunaDataNascimentoDependente -->";

echo "<select name='estadoCivilDependente[]' class='comboEstadoCivilDependente' tabindex='" . $tabIndex . "'>";
echo "<option value='0' selected='selected'>estado civil</option>";
echo "<option value='1'>solteiro(a)</option>";
echo "<option value='2'>casado(a)</option>";
echo "<option value='3'>separado(a)</option>";
echo "<option value='4'>divorciado(a)</option>";
echo "<option value='5'>viúvo(a)</option>";
echo "</select>";
$tabIndex++;

echo "<div class='colunaAdicionarRemover'>";
echo " <a href='#' class='adicionarDependente'><img src='" . $pastaBaseTema . "images/site/adicionarCampo.jpg' width='19' height='19' alt='adicionar um dependente' title='adicionar um dependente' style='border:none;' /></a>";
echo "</div> <!-- Fim da div colunaAdicionarRemover -->";
echo "</div> <!-- Fim da div blocoDependentes -->";

echo "<div class='blocoDependentesRemocao'>";

echo "<div class='colunaNomeDependente'>";
echo "Nome <input type='text' name='nomeDependente[]' class='textBoxDependente' maxlength='120' value='' tabindex='" . $tabIndex . "' />";
$tabIndex++;
echo "</div> <!-- Fim da div colunaNomeDependente -->";

echo "<select name='parentescoDependente[]' class='comboParentescoDependente' tabindex='" . $tabIndex . "'>";
echo "<option value='0' selected='selected'>parentesco</option>";
echo "<option value='1'>irmão(ã)</option>";
echo "<option value='2'>tio(a)</option>";
echo "<option value='3'>primo(a)</option>";
echo "<option value='4'>sobrinho(a)</option>";
echo "<option value='5'>avô(ó)</option>";
echo "</select>";
$tabIndex++;

echo "<div class='colunaDataNascimentoDependente'>";

echo "Nascimento <input type='text' name='nascimentoDependente[]' class='textBoxDataNascimentoDependente' maxlength='10' value='' tabindex='" . $tabIndex . "' />";
$tabIndex++;
echo "</div> <!-- Fim da div colunaDataNascimentoDependente -->";

echo "<select name='estadoCivilDependente[]' class='comboEstadoCivilDependente' tabindex='" . $tabIndex . "'>";
echo "<option value='0' selected='selected'>estado civil</option>";
echo "<option value='1'>solteiro(a)</option>";
echo "<option value='2'>casado(a)</option>";
echo "<option value='3'>separado(a)</option>";
echo "<option value='4'>divorciado(a)</option>";
echo "<option value='5'>viúvo(a)</option>";
echo "</select>";
$tabIndex++;

echo "<div class='colunaAdicionarRemover'>";
echo "<a href='#' class='removerDependente'><img src='" . $pastaBaseTema . "images/site/removerCampo.jpg' width='19' height='19' alt='remover um dependente' title='remover um dependente' style='border:none;' /></a>";
echo "</div> <!-- Fim da div colunaAdicionarRemover -->";
echo "</div> <!-- Fim da div blocoDependentesRemocao -->";
echo "</div> <!-- Fim da div valor -->";
echo "</div> <!-- Fim da div campoFormulario -->";

E o código jquery:

// função para a remoção de um campo referente a dependentes

function removeDependente() {
	$(".removerDependente").unbind("click");
	$(".removerDependente").bind("click", function () {
 if ($(".blocoDependentesRemocao").length > 1) {
 $(this).parent().parent().remove();
 }
	});
}

// função para adicionar um campo referente a dependentes

$(".adicionarDependente").live('click', function () {
	novoCampo = $(".blocoDependentesRemocao:first").clone();
	novoCampo.show();
	novoCampo.find("input").val("");
	novoCampo.insertAfter(".blocoDependentesRemocao:last");
	removeDependente();
});

 

 

	Este código funciona perfeitamente no Firefox, mas não nos outros navegadores. Já tentei analisar com o firebug, o do próprio IE para ver se vinha alguma mensagem de erro, mas nada.

 

	Este tipo de funcionalidade é essencial para o sistema e preciso que funcione tanto no firefox quanto no ie, pelo menos.

 

	Alguém poderia me ajudar?

Obrigado.