JavaScript cookieでaddClass、removeClassの状態を保持

cookieでaddClass、removeClassの状態を保持し、
ブラウザで戻るボタンを押した際に、状態を保持しておきたいです。

現在の状況

■ コンテンツの高さが一定を超えた場合に、「続きを読む(viewbtn)」が表示されます。
■ 高さより超えた部分を隠し、「続きを読む(viewbtn)」ボタンをクリックした場合に表示されます。
■ 高さを超えない場合、「続きを読む(viewbtn)」ボタンは非表示になります。
■ コンテンツは複数入ります。

<section class="content">
コンテンツ内容が入ります。コンテンツ内容が入ります。コンテンツ内容が入ります。コンテンツ内容が入ります。コンテンツ内容が入ります。
<div class="viewbtn">続きを読む</div>
</section>
<section class="content">
コンテンツ内容が入ります。
<div class="viewbtn">続きを読む</div>
</section>
<section class="content">
コンテンツ内容が入ります。
<div class="viewbtn">続きを読む</div>
</section>

$(function(){
         $(".content").each(function () {
         var pagecontentheight = $(this).height();
         if(pagecontentheight > 600){
          $(this).addClass('hidden');
         }
         });
        });
         $(function(){
             $(".content").each(function () {
             var pagecontentheight = $(this).height();
              if(pagecontentheight < 600){
              $(this).children('.viewbtn').addClass('hidden');
             }else{
              $(this).children('.viewbtn').removeClass('hidden');
             }
           });
        });

.content{overflow: hidden;position: relative;height: auto;}
.content.hidden{height:600px;}
.viewbtn.hidden{display: none;}
.viewbtn{position: absolute;bottom:0;width: 100%;text-align: center;transition: 2s}

cookieに保存するために、
下記コードで試しましたが、うまく動かず、、
何かおかしい点、解決策ありましたらご教授お願い致します。

window.addEventListener('DOMContentLoaded', function(e){
  var bd=document.querySelector('.content');
  if(ck=getCookie('bodycookie')) bd.classList.add(ck);
  document.querySelector('.viewbtn').addEventListener('click',function(e){
    bd.classList.toggle('hidden');
    if(bd.classList.contains('hidden')){
      setCookie('bodycookie','hidden');

    }else{
      delCookie('bodycookie');
    }
  });
});
function setCookie(key,val,url){
  tmp = key+"="+escape(val)+";";
  tmp += "expires=Fri, 31-Dec-2030 23:59:59;";
  if(url){
    tmp += "domain="+getDomain(url)+";";
    tmp += "path="+getDomainPath(url)+";";
  }
  document.cookie = tmp;
}
function getCookie(key){
  var params  = document.cookie.split(/; */);
  var ret=null;
  for(var i=0;i<params.length;i++){
    if(r=params[i].match(new RegExp("^"+key+"="+"(.*)"))){
      ret=r[1];
    }
  }
  return ret;
}
function delCookie(key){
  expiredate = new Date();
  expiredate.setYear(expiredate.getYear()-1);
  tmp = key+"=;";
  tmp += "expires="+expiredate.toGMTString();
  document.cookie = tmp;
}

Lhankor_Mhy

2020/11/10 11:44

「うまく動かず」とのことですが、具体的には何が起きていますか？結果（実際に起きたこと）を書きましょう https://teratail.com/help/question-tips#questionTips3-4-1 エラーメッセージや実行ログをコピー&ペーストしましょう https://teratail.com/help/question-tips#questionTips3-4-2 期待した処理結果を書きましょう https://teratail.com/help/question-tips#questionTips3-4-3