Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Sander de Wijs
Courses Plus Student 22,267 PointsColor not appending to <li> css
When I run this code on my page, the new background color is not added to the new <li></li> item. I checked the code several times and can't see the problem.
var color = $(".selected").css("background-color");
$(".controls").on("click", "li", function(){
$(this).siblings().removeClass("selected");
$(this).addClass("selected");
color = $(this).css("background-color");
});
$("#revealColorSelect").click(function(){
changeColor();
$("#colorSelect").toggle();
});
function changeColor() {
var r = $("#red").val();
var g = $("#green").val();
var b = $("#blue").val();
$("#newColor").css("background-color", "rgb(" + r + "," + g + "," + b + ")");
}
$("input[type=range]").change(changeColor);
$("#addNewColor").click(function(){
var $newColor = $("<li></li>");
$newColor.css("background-color", $("newColor").css("background-color"));
$(".controls ul").append($newColor);
$newColor.click();
});
4 Answers
Justin Hill
16,642 PointsIt looks to me like you missed a "#" on your 4th to last line. You're trying to grab the background-color property of the element with id #newColor right?
Ben Attenborough
Front End Web Development Techdegree Graduate 32,769 PointsI had a similar problem. Here is my code. The new color is not appearing when I press Add Color
//When add color is pressed
$("#addNewColor").click(function() {
console.log("Add new color clicked");
//Append the color to controls ul
var $newColor = $("<liv></li>");
$newColor.css("background-color", $("#newColor").css("background-color"));
$(".controls ul").append($newColor);
//Select the new color
$newColor.click();
});
Ben Attenborough
Front End Web Development Techdegree Graduate 32,769 PointsSorry, figured it out, I had <liv> instead of <li> on line 5!
Sander de Wijs
Courses Plus Student 22,267 Pointsfacepalm Thanks, I completely overlooked that! Thanks Justin!