Clientside HTML Minification

Question

Is there a way to this kind of minification with javascript and update the DOM (clientSide)

Input:

<div class="parentDiv">
    <div class="childDiv">Some text</div>
    <div class="childDiv">Some text</div>
</div>

Output:

<div class="parentDiv"><div class="childDiv">Some text</div><div class="childDiv">Some text</div></div>

I know its useless doing the minification after downloading all the content. The point here is to stop the identation to create gaps between my divs. I know that if I put a comment between the tags the gap won't appear but it gets difficult to understand the code with so many comments between my div tags.

See this [post] and you'll understand what I mean.

Answer 1

I managed to achieve what I wanted and even created a jQuery plugin to it.

jQuery.fn.clearWhiteSpace = function () {
    var htmlClone = this.html().replace(/\n[ ]*/g,"");
  this.html(htmlClone);

  return this;
}

$(".parentDiv").clearWhiteSpace();

there is an example I wrote in jsfiddle

But thanks for all your effort. :)