title: Why is document.getElementById().setAttribute not working correctly in Chrome and IE?
body: <p>I am using the following function:    </p>
  
  <p><code>function pdfChanger(location){
  document.getElementById("pdf").setAttribute("data",location);
  }</code>  </p>
  
  <p>which is called here:</p>
  
  <pre><code>&lt;a href="javascript:pdfChanger('documents/SecurityDocs/sample.pdf')"&gt;test1&lt;/a&gt;&lt;br/&gt;
  </code></pre>
  
  <p>and is designed to change the pdf file displayed in this object:</p>
  
  <pre><code>&lt;object id="pdf" data="documents/sample2.pdf#toolbar=0&amp;navpanes=0&amp;scrollbar=0&amp;page=1&amp;view=FitHtop" 
                      type="application/pdf"&gt;&lt;/object&gt;
  </code></pre>
  
  <p>In firefox clicking on the link which evokes this function changes the pdf object correctly. In chrome, however, you have to click on the pdf after you have clicked the link, in order to correctly display the changed pdf. In IE the pdf does not change at all. Why is this happening and what can I do to make this function work uniformly in all browsers?</p>