[SOLUCIONADO] Cargar contenido a medida que cambia el DOM con ajax

[Sirrohan]

Saludos amigos,

Tengo una pequeña situación con jquery, resulta que estoy haciendo una búsqueda, pero al momento de cargar el contenido cambia el DOM, lo estoy haciendo de esta forma:

Código Javascript:

$(document).ready(function(){
$("li.Buscar").click(function(){
        Buscar();
    });
function Buscar()
{
    var contenido= $("<td colspan='5'><h1>Buscar</h1></td>");
    $.get("../modulo_buscar/Vista/Buscar.php",  function(resultado)
    {
        if (resultado == false) {
            alert ('Ocurrió un error');
        }
        else
        {
            $(".Contenido").empty();
            $(".Contenido").append(contenido); 
            $(".Contenido").append(resultado);//aqui se agrega en la clase contenedora del html
 
            var campo1= $("#campo1").val(); //este campo viene con el get
            var url = $(this).attr('action');  //la url del action del formulario
 
            $("#form_buscar").on('submit',function() //este submit viene del archivo php
            {
                $.get(url, {campo1:campo1}, function(resultado2){
                        if(resultado2 == false)
                        {
                            alert("No se encontró el campo");
                        }
                        else
                        {   //#TablaBusqueda es el identificador que viene del
                    $(".Contenido").empty();
                    $(".Contenido").append(contenido);
                    $(".Contenido").append(resultado2);
 
                        }
 
                    });
 
            });
 
            
        }
    });
}
 

Código HTML:

<table align="center" border="0" id="TablaPrincipal">
        <tr>
            <td colspan="6" class="Encabezado">
                <p class="Titulo">Titulo</p>                
            </td>
        <tr>
        <tr>
            <td colspan="6" class="cintillo">
                <span> Hola!</span>
            </td>
        </tr>
        <tr>
            <td colspan="1" width="15%"  class="FondoGris">
                <ul class="Menu">
                    <br />
                    <li class="Agregar"><a href="#"><h3>Agregar</h3></a></li>
                    <br />
                    <li class="Editar"><a href="#"><h3> Modificar / Eliminar </h3> </a></li>                    
                    <br />
                    <li class="Buscar"><a href="#"><h3> Buscar </h3></a></li>
                    <br />
                    <li class="Reportes"><a href="#"><h3> Reportes </h3></a></li>
                    <br />
                </ul>
            </div>
            </td>
            <span id="Contenedor" >
                <td colspan="5" width="85%" class="Contenido" style="position: absolute;top: 18%;left: 16%;height: 55%;width:82.5%; overflow:auto;  text-align: left;"> 
                    <h1>BIENVENIDOS</h1>                                    
                </td>
                </span> 
            </span>
        </tr>
 
        
 
        <tr>
            <td colspan="6" class="cintillo">
            <span class="PiePagina">
                Desarrollado por mi
            </span>
            </td>
        </tr>       
        <tr>
            <td colspan="6" class="VersionNavegador">
            &nbsp;
            </td>
        </tr>
 
    </table>
 

Así puedo mostrar el formulario que se entregar en el primer $.get... pero a la hora de mostrar el html en el segundo get, éste se abre en una ventana nueva y no dentro del contenedor del html...

¿Cómo podría solucionar esto?

[Sirrohan]

Bueno, ya lo solucioné.... tuve que ser más específico con el selector...

Código Javascript:

$("#TablaPrincipal td.Contenido").empty();
        $("#TablaPrincipal td.Contenido").append(contenido2);
        $("#TablaPrincipal td.Contenido").append(resultado2);