[jQuery] .append() variable content rather than text
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.