Can css affect elements added by document.write?

Question

If I have this css

div.myContainer img.noCampaign { display:none; }

and this html/javascript

<div class="myContainer">
  <script>document.write('<img class="noCampaign" src="whatever.jpg" />');</script>
</div>

I can't seem to get the img element to disappear?

Is there no access to the img element through css when dynamically adding elements with javascript document.write?

/T

Answer 1

CSS styles effect js-generated HTML elements -- in fact, your example code works exactly as expected in my tests. (After adding in the <script> element, anyway)

I suspect there's some other problem with your code that's preventing it from behaving how you like -- If you edit the question with the code you actually used we might be able to help you find the problem. There's probably just a simple syntax or precedence error in there somewhere.

Answer 2

You can append child elements to the document without using document.write. Add an image element as child to the div.

Use

document.createElement