Adding a class to a div not working properly

I am dynamically creating a div using jQuery and then adding a class to it in order to style it:

var borderDiv = $('<div />').addClass('borderTaco');
// add borderDiv to the DOM...

Where borderTaco is defined to be the following style:

.borderTaco {
  background-color : #cde;
  z-index : 1;
  height :开发者_运维技巧 100%;
}

Even though the element is being properly inserted into the DOM, the style doesn't seem to be applied to the div. When I inspect the element in firebug, it indicates that the element does have the correct class attribute, but it has no style rules and doesn't appear correctly.

Here is a jsbin of the code.

---

Your class is used in an iframe so the class should be defined in this iframe.

---

Try calling addClass after the div is added to the DOM.

var borderDiv = $('<div />');
// add to DOM
borderDiv.addClass('borderTaco');

---

You can also just add the class right to the div in the selector:

$('<div class="borderTaco" />').appendTo('body');