Question

I receive no errors from either jshint or console for this code. Yet, my ajax content does not post to the intended div(s). The alerts, however, fire:

    var recentVar;
    var highlightsVar;
    var test3;
    var test4;

function switcher(divToShow, thisVar, otherVar, url, div){
    $("#site-nav li a").parents().removeClass("nav-active");
        $(div).addClass("nav-active");
        if (otherVar){ $(otherVar).detach();}

        if(typeof thisVar === 'undefined') {
            thisVar = $(divToShow + " ul.top-level").load("assets/includes/" + url, function () {
                alert("I'm new");
            });
        } else {
            $(thisVar).appendTo("#content-listing");
            alert("I'm old");
        }
}

    //Recent
    $("#site-nav .nav1").on("click", function (event) {
    switcher("#recent", "recentVar", "highlightsVar", "recent.php", "#site-nav .nav1");
    event.preventDefault();
    });

    //Highlights
    $("#site-nav .nav2").on("click", function (event) {
    switcher("#highlights", "highlightsVar", "recentVar", "all-web.php", "#site-nav .nav2");
    event.preventDefault();
    });

Answer 1

It has nothing to do with AJAX, but I think your issue is here.

$(thisVar)

thisVar is simply text. If you check, you will see that $(thisVar).length is 0. This is because you are calling: $("recentVar"), which will search for any elements of type <recentVar></recentVar>, which clearly there are none. If your intent is to append that text, you can use append or create an element and set the text to recentVar and append that.

EDIT: Another issue:

$(divToShow + "ul.top-level")

You need a space here:

$(divToShow + " ul.top-level")

Otherwise you are trying to match #recentul.top-level which is nonsense.

---