[Resolvido] Problema em usar script de auto completar.

Olá amigos do fórum, estou com uma dúvida e gostaria da ajuda de vocês se possível.

Estou tentando criar um sistema que faz duas buscas com caixas separadas, por exemplo: uma caixa vai para a busca na página X e a outra busca na página Y. Contudo o sistema esta funcionando bem, só que quando eu altero os atributos que deveriam ser refentes ao CLASS e ID que mudariam de acordo com o CSS, o script não funciona mais.

Código CSS

#suggest2 {
position: absolute;
 background-color: #ccc;
 width: 385px;
 text-align: left;
 /*border: 1px solid #000;*/
}

#suggest2 li {

 margin: 2px;
}

#suggest2 a {

 display: block;
 color: #000;
 text-decoration: none;
}

#suggest2 a:hover {

 background: #eee;
 text-decoration: underline;
 color: #f00;
}

/ suggest 3 /

#suggest3 {
position: absolute;
float: right;
margin-left: 400px;
 background-color: #ccc;
 width: 385px;
 text-align: left;
 /*border: 1px solid #000;*/
}

#suggest3 li {

 margin: 2px;
}

#suggest3 a {

 display: block;
 color: #000;
 text-decoration: none;
}

#suggest3 a:hover {

 background: #eee;
 text-decoration: underline;
 color: #f00;
}

E o script que joga as buscas para as páginas específicas.

<script type="text/javascript">
//// Empresa

$(document).ready(function(){
	$("input[name='keywork']").keyup(function(){
 createList('.suggest');
 $.ajax({
 type: "GET",
 url: "http://127.0.0.1/guia/keywork.php",
 data: "parte="+$(this).val(),
 success: function( data ){
 $("#suggest2").html( data );
 }
 });
	});
	$("#suggest2").mouseout(function(){
 $("#suggest2").remove();
	});
 });
 function createList( el )
 {
 $("#suggest2").remove();

 var list = document.createElement('ul');
 list.id = 'suggest2';
 $( el ).append( list );
 }

//// Categoria

 $(document).ready(function(){
 $("input[name='city']").keyup(function(){
 createList('.suggest');
 $.ajax({
 type: "GET",
 url: "http://127.0.0.1/guia/city.php",
 data: "parte="+$(this).val(),
 success: function( data ){
 $("#suggest3").html( data );
 }
 });
 });
 $("#suggest3").mouseout(function(){
 $("#suggest3").remove();
 });
 });
 function createList( el )
 {
 $("#suggest3").remove();

 var list = document.createElement('ul');
 list.id = 'suggest3';
 $( el ).append( list );
 }
</script>

Quando eu mudo na parte

$("#suggest3").html( data );

e deixo os dois iguais os dois funcionam, mas se mudar um deles o outro não funciona.

O que devo fazer para deixá-los um sem depender do outro?

Obrigado desde já.