title: Javascript Solution Remove Specific Tag but leave the rest in a specific DIV
body: <p>I have a div structure that looks like this...</p>
  
  <pre><code>&lt;div class="gallery_lightview"&gt;
      &lt;div id="lg_image"&gt;
          &lt;a href="http://www.website.com/?iframe=true&amp;width=100%&amp;height=100%" rel="prettyPhoto[iframes]" class="lightview_main" title="TITLE HERE"&gt;
              &lt;img class="alignnone" src="HEADER.jpg" alt="" /&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What I want to do is remove the  tags that show up ONLY between div class "gallery_lightview" and leave the  tag. So once its all stripped out it would look like...</p>
  
  <pre><code>&lt;div class="gallery_lightview"&gt;
      &lt;div id="lg_image"&gt;
          &lt;img class="alignnone" src="HEADER.jpg" alt="" /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Basically making this a non clickable image. Is this possible? Its going on a Mobile site and I don't want this to be in the header. Really wanted it to be a self contained Javascript that sat above the <code>"the_content"</code> Wordpress call (which is where the <code>"gallery_lightview" div</code> code is.</p>
  
  <p>I choose to not use a jQuery because, since its mobile it would add to the load. And literally the only thing the library would be doing was removing the <code>&lt;a&gt;</code> tag. </p>
  
  <p>Any ideas?</p>