Adding a DIV with javascript : no background color anymore?

I'm adding a DIV with JavaScript .createElement..., I do a setAttribute("class", "someCSS"); so far, so good.

Now, in my "someCSS" I got a working :hover where it changes the text color and background color, so far, so good.

If I use this "someCSS" in a static way, when I hover my mouse both background and color changes on hover.

But when I add a DIV with same "someCSS" class, the text color changes on hover, but not the background!

I tested to add a DIV with createElement and set a style to it with background, same problem. The div shows up but without background.

Anyone got any idéa what I'm doing wrong here?

Never mind, just solved it.

I did this : .createElement("SOMENAME") instead of .createElement("DIV")

*lol*... I'm an idiot. ( this took me 2 hours haha )

turrican said:

Never mind, just solved it.

 

I did this : .createElement("SOMENAME") instead of .createElement("DIV")

 

*lol*... I'm an idiot. ( this took me 2 hours haha )

Been there, done that.

To stop making such mistakes, I found it's a good idea to write simple wrapper functions to create elements:

function createElementWithID(tag, id)
{
  var e = document.createElement(tag);
  e.id = id;
  return e;
}
function createElementWithClassName(tag, className)
{
  var e = document.createElement(tag);
  e.className = className;
  return e;
}
function createDivWithID(id)
{
  return createElementWithID('DIV', id);
}
function createDivWithClassName(className)
{
  return createElementWithClassName('DIV', className);
}

TommyCarlier said:

turrican said:

*snip*

Been there, done that.

To stop making such mistakes, I found it's a good idea to write simple wrapper functions to create elements:

function createElementWithID(tag, id)
{
  var e = document.createElement(tag);
  e.id = id;
  return e;
}
function createElementWithClassName(tag, className)
{
  var e = document.createElement(tag);
  e.className = className;
  return e;
}
function createDivWithID(id)
{
  return createElementWithID('DIV', id);
}
function createDivWithClassName(className)
{
  return createElementWithClassName('DIV', className);
}

Yes, very true. Thank you very much to the tip. I actually usually do that. However, I'm in middle of a very big project which needs to be done "yesterday" if you know what I mean. hehhe... so I'm a bit stressed out on it and just want to get it to work and out the door. I'll then come back when I have time and rewrite the horrible coding mess I created. haha

turrican said:

TommyCarlier said:

*snip*

Yes, very true. Thank you very much to the tip. I actually usually do that. However, I'm in middle of a very big project which needs to be done "yesterday" if you know what I mean. hehhe... so I'm a bit stressed out on it and just want to get it to work and out the door. I'll then come back when I have time and rewrite the horrible coding mess I created. haha

How likely is the “when I have time” part?

TommyCarlier said:

turrican said:

*snip*

How likely is the “when I have time” part?

haha... shhhhhhhhhhhhhhh, my boss can hear ya!

naah, but on the serious side, I never leave spaghetti code on important projects, I always go back and fix it. but I see the point. hehhhe