How to hide and show gridview columns one by on using javasc

Question

How to hide and show gridview columns one by on using javascript at client side only.
where idinow has current button id,

<script language="JavaScript">
function hideColumn(idinow) {
  if (idinow == "GridView1_ctl01_Hide2") {
  var calnumb = 1;
  hidecal(calnumb)
  }
  else if (idinow == "GridView1_ctl01_Hide3") {
  var calnumb = 2;
  hidecal(calnumb)
  }
  else if (idinow == "GridView1_ctl01_Hide4") {
  var calnumb = 3;
  hidecal(calnumb)
  }
  else if (idinow == "GridView1_ctl01_Hide5") {
  var calnumb = 4;
  hidecal(calnumb)
  }
  return false; 
}

function ShowColumn(idinow) {
  if (idinow == "Show6") {
  var calnumb = 1;
  showcal(calnumb)
  }
  else if (idinow == "Show7") {
  var calnumb = 2;
  showcal(calnumb)
  }
  else if (idinow == "Show8") {
  var calnumb = 3;
  showcal(calnumb)
  }
  else if (idinow == "Show9") {
  var calnumb = 4;
  showcal(calnumb)
  }
  return false;
}
function showcal(calnumb) {
  var col_num1 = calnumb;
  var rows1 = document.getElementById("GridView1").rows;
  for (i = 0; i < rows1.length; i++) {
  rows1[i].cells[col_num1].disabled = false;
  }
  return false;

}
function hidecal(calnumb) {
  var col_num = calnumb;
  var rows = document.getElementById("GridView1").rows;
  for (i = 0; i < rows.length; i++) {
  rows1[i].cells[col_num1].disabled = true;
  }
  return false;
}
 </script>