What about a solution with "innerHTML"..?

<apex:page>

<script>

var contentArray = new Array();

var idArray = new Array();

var isCollapsed = false;

function collapse(ids){

if (isCollapsed) {

fix();

return;

}

isCollapsed = true;

idArray = ids.split(',');

for (var i = 0; i < idArray.length; i++) {

contentArray[i] = document.getElementById(idArray[i]).innerHTML;

document.getElementById(idArray[i]).innerHTML = '';

}

}

function fix(){

isCollapsed = false;

for (var i = 0; i < idArray.length; i++) {

document.getElementById(idArray[i]).innerHTML = contentArray[i];

}

}

</script>

<apex:form>

<apex:pageblock>

<apex:pageblockSection id="ps1">

This is first pageblockSection;<br/><br/><br/>

</apex:pageblockSection>

<apex:pageblockSection id="ps2">

This is second pageblockSection;<br/><br/><br/>

</apex:pageblockSection>

<apex:pageblockSection id="ps3">

This is third pageblockSection;<br/><br/><br/>

</apex:pageblockSection>

<apex:commandButton value="Click" onClick="collapse('{!$Component.ps1},{!$Component.ps2},{!$Component.ps3}');return false;"></apex:commandButton>

</apex:pageblock>

</apex:form>

</apex:page>