Question

I’m creating an option in a select element and trying to change the background image.

nextItem = document.createElement('option');

nextItem.innerHTML = text;

nextItem.style.backgroundImage = "url(icons/add.png);";

nextItem.className = "class1";

When I use firebug, however, I can see that what actually gets created is this:

<option class="class1" style="">text</option>

Why is it creating the the style attribute but not putting any information in it?

Answer 1

Remove the semi-colon in the url.

Change:

nextItem.style.backgroundImage = "url(icons/add.png);";

to:

nextItem.style.backgroundImage = "url(icons/add.png)";

jsFiddle example