title: How to dynamically change html elements and copy attributes with javascript
body: <p>How can you change the hyrarchy / structure of html when it's rendered with javascript?
  I would like to remove a parent div and copy it's attribute and classname
  to it's child element. But I want to do this in the whole page that contains a certain class name.</p>
  
  <p>In code example: I need this code </p>
  
  <pre><code>&lt;div class="abc" myid="123" position="2"&gt;
  &lt;div class="someblock"&gt;
      &lt;p&gt;Some paragraph&lt;/p&gt;
      &lt;img width="140px; height: 140px; class="myimg" src="url to imgage"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>changed to : </p>
  
  <pre><code>&lt;div class="someblock" class="abc" myid="123" position="2"&gt;
  &lt;p&gt;Some paragraph&lt;/p&gt;
  &lt;img width="140px; height: 140px; class="myimg" src="url to imgage" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Does anyone know how this can be done with JavaScript, or jQuery? 
  Thanks in advance!,</p>
  
  <p>Chris.</p>