.load() me esta dando problemas Estoy trabajando en un proyecto de cargador de secciones y parece que no puedo recuperar el archivo que necesito.

Lo que estoy tratando de lograr: #sectionContainer está vacío en la carga del documento, pero en el documento listo se 'llena' conPages1.html. Esto se hace mediante un archivo JavaScriptsections.js. El archivo JS y el index.html NO están en la misma carpeta. Aquí está la estructura del sitio (estoy ejecutando muchos proyectos en mi sitio)

carpeta principalProyecto 1Proyecto 2 (sectionLoaderTest /)index.htmlPages1.htmlPages2.htmlcss /js /secciones.jsProyecto 3...

Y el código que utilizo para cargar Pages1.html en listo:

$(document).ready(function () {
    $("#sectionContainer").load("../Pages1.html", function (response, status, xhr) {
        if (status == "error") {
            var msg = "An error occurred. Status code: ";
            $("#error").html(msg + xhr.status + ". Status text: " + xhr.statusText);
        }
    });
});

He probado todos los métodos posibles (/, ./,., ../, ..) que conozco y nada parece funcionar. Aquí está elcaso de prueba.

¿Alguien sabe lo que estoy haciendo mal?