Creating Color Gallery

Question

I am trying to make Colors' Gallery, but I cannot achieve it. Here is what I've done so far.
I want to try, when the user clicks button, li appended to ul and this is where the mess starts. I thought after I append li, the background-color would've applied to li itself but it instead applied to ul. Could you help me pls, cuz I am newbie and also don't blame me for my English if I have mistakes. English is my third language, trying to explain as hard as I can!

score 2 · Answer 1 · answered Mar 02 '12 at 08:35

You need to simply change the order of operations.

Instead of targeting the Gallery, adding the element, and trying to change the css.

We'll create the element, target the Element's CSS, then append that element to #gallery.

Have a look at the jsfiddle below to see the change in action.

http://jsfiddle.net/8USqU/4/

score 1 · Accepted Answer · answered Mar 02 '12 at 08:34

1

I changed your code check it out http://jsfiddle.net/8USqU/5/

This part is looking wrong.

$('#gallery').append('<li></li>').css('background', storedHex);

I changed to

$("<li>").css('background-color', storedHex).appendTo($('#gallery'));

Actually you can use background-color instead of background. Because background selector can take lots of property, but all you need is background-color

answered Mar 02 '12 at 08:34

arunes

3,464
2
21
31

You need to make that

Ohgodwhy

Mar 02 '12 at 08:36

Not necessarily. Check this http://stackoverflow.com/questions/268490/jquery-document-createelement-equivalent there is not much difference between them. – arunes Mar 02 '12 at 09:09

That's not it. if you use your method then you're using the HTML way. If you use self-closing tags you're using XHTML valid markup. – Ohgodwhy Mar 02 '12 at 09:15

Creating Color Gallery

2 Answers2