I am trying to write a div using document.write() from a script. I seem to be able to write a blank div but whenever I add a class or any attributes to the div it doesn't write anything anymore.

This is the code I am trying to run.

document.write("<div class="new_prod_box">");
document.write("<a href="details.html">");
document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
document.write("</a>");
document.write("<div class="new_prod_bg">");
document.write("<a href="details.html"><img src="images/thumb1.gif" alt="" title="" class="thumb" border="0" /></a>");
document.write("</div>");
document.write("</div>");

I am not having a problem loading the xml as I have already tested this, and I have run a script in the section where I want it to be written and it writes in that area just fine. I have also testing using a plain div which works fine, it just seems to be a problem when assigning a class to that div.

I have run this code to see if it was a problem with document.write() writing a div tag and it works fine, however it doesn't have any formatting.

document.write("<div>");
document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
document.write("</div>");

I would just write a div in the main section and then write everything to that but I need have one created for each entry in the xml, and this is the only way I can think of doing so.

This is the basic outline of the div that I need to have for each product

<div class="new_prod_box">
    <a href="details.html">product name</a>
    <div class="new_prod_bg"
    <a href="details.html"><img src="images/thumb1.gif" alt="" title="" class="thumb" border="0" /></a>
    </div>           
</div>

Any help is greatly appreciated.

I am trying to write a div using document.write() from a script. I seem to be able to write a blank div but whenever I add a class or any attributes to the div it doesn't write anything anymore.

This is the code I am trying to run.

document.write("<div class="new_prod_box">");
document.write("<a href="details.html">");
document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
document.write("</a>");
document.write("<div class="new_prod_bg">");
document.write("<a href="details.html"><img src="images/thumb1.gif" alt="" title="" class="thumb" border="0" /></a>");
document.write("</div>");
document.write("</div>");

I am not having a problem loading the xml as I have already tested this, and I have run a script in the section where I want it to be written and it writes in that area just fine. I have also testing using a plain div which works fine, it just seems to be a problem when assigning a class to that div.

I have run this code to see if it was a problem with document.write() writing a div tag and it works fine, however it doesn't have any formatting.

document.write("<div>");
document.write(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
document.write("</div>");

I would just write a div in the main section and then write everything to that but I need have one created for each entry in the xml, and this is the only way I can think of doing so.

This is the basic outline of the div that I need to have for each product

<div class="new_prod_box">
    <a href="details.html">product name</a>
    <div class="new_prod_bg"
    <a href="details.html"><img src="images/thumb1.gif" alt="" title="" class="thumb" border="0" /></a>
    </div>           
</div>

Any help is greatly appreciated.

• javascript
• html

Share Improve this question Follow asked Aug 19, 2015 at 13:11 user2854076user2854076 8333 silver badges66 bronze badges

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 2

It's because your string contains double quotes. You need to either use single quotes, or escape the double quotes. This is not valid:

document.write("<div class="new_prod_box">");

These are:

document.write('<div class="new_prod_box">');
document.write("<div class=\"new_prod_box\">");

Try this:

document.write('<div class="new_prod_box">\
  <a href="details.html">' + x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue + '</a>\
  <div class="new_prod_bg">\
      <a href="details.html"><img src="images/thumb1.gif" alt="" title="" class="thumb" border="0" /></a>\
  </div>\
</div>');

Try using single quotes and write only once:

var myhtml = "<div class='new_prod_box'>";
myhtml += "<a href='details.html'>");
myhtml += x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue;
myhtml += "</a>";
myhtml += "<div class='new_prod_bg'>";
myhtml += "<a href='details.html'><img src='images/thumb1.gif' alt='' title='' class='thumb' border='0' /></a>";
myhtml += "</div>";
myhtml += "</div>";
document.write(myhtml);

You are messing with " in your code. E.g. first line
document.write("<div class="new_prod_box">");
to be replaced with
document.write("<div class='new_prod_box'>");

Also in your HTML there is div start <div class="new_prod_bg" but it never ends (missing closing >)