I am fairly new to jquery and javascript, but giving it a fair try because I
am interested in learning it. The trouble I am having revolves around my
navigation links. I would like each one to show a specific div in a
container I have set up. The HTML loads with all of the divs visible, which
I then store each one with a project variable. So, the problem happens when
you click on a navMenu link... The div fades out as supposed to, but instead
of it being filled with a replacement div stored from earlier, it just loads
the string "project2" or whichever one was clicked. Here is my code:

$(document).ready(function(){

        var project1 = $("#project1").html();
        var project2 = $("#project2").html();
        var project3 = $("#project3").html();
        var project4 = $("#project4").html();
        var project5 = $("#project5").html();
        var project6 = $("#project6").html();
        var project7 = $("#project7").html();
        
        $("#projects").find(".projectBody").not(":first").remove();
        
        $("#navMenu ul li a").click(function () {
                var projectId = $(this).attr("href");
                var projectName = projectId.substr(1);
                var projectDiv = '<div class="projectBody" id="'+ projectName 
+'"></div>';
                
                $("#projects").find(".projectBody").fadeOut("slow", function(){
                        $("#projects").find(".projectBody").remove();
                        $("#projects").append(projectDiv);
                        $("#projects").find(projectId).hide();
                        $("#projects").find(projectId).append(projectName);
                        $("#projects").find(projectId).fadeIn("slow");
                });
     });
});
-- 
View this message in context: 
http://www.nabble.com/.append%28%29-variable-content-rather-than-text-tp20178692s27240p20178692.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.

Reply via email to