Показать\скрыть блок - куки

[Tetatet]

На сайте было необходимо сварачивание\разворчивание блока, что уже реализовано этим кодом:

<!--  -->
<style type='text/css'>
.headline {border: 0px solid #000000; cursor: pointer; width: 150px; text-align: left;}
.hidden {display: none; border: 0px solid #000000; text-align: center; margin-top: 0px;}
</style>
<script type="text/javascript">
  function show(ele) {
      var srcElement = document.getElementById(ele);
      if(srcElement != null) {
          if(srcElement.style.display == "block") {
            srcElement.style.display= 'none';
          }
          else {
            srcElement.style.display='block';
          }
      }
  }
</script>
 <!--  -->
<div class="headline" onclick="show('cat1')"><p style="text-align: left;"><img class="alignleft" src="http://..." alt="Узнать больше" width="15" height="15"/>Узнать больше</p></div>
<!--  -->
<div class="hidden" id="cat1">
<!--ТЕКСТ БЛОКА-->
</div>
<!--  -->

НО, для этого кода необходимы куки .... блок разварачивается, в нём есть переход на другую страницу, при этом, блок должен оставаться развёрнутым, как и при перезагрузке ... короче через КУКИ, но КАК? Как и куда втулить в код куки ?