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.