css { content: "text"}, How do i add tags?

Question

I wrote some dummy css. Instead of a tag i got escaped characters. How can i add a div tag instead?

.HeaderName:after{
content: "<div class=\"Name2\">text</div>";
}

.Name2 {
color: red;
}

Answer 1

First of all, the content declaration cannot be used to add tags to the page, as tags are not "content" but structure.

Second, CSS is meant to style, not to define content. The content declaration shouldn't be used, imho.

You'd better use a line of jquery to achieve your purpose, something like:

$(".HeaderName").after("your html here");

It works and does not break up any conceptual rule. :)

Answer 2

You can't insert tags using content: in CSS. Here is the relevant part of the spec; see the 'content' property in the CSS 2.1 spec.