非同期いいねを作るときに詰まった話

こちらのサイトを使って
https://techtechmedia.com/favorite-function-rails/
非同期通信を使ったいいね機能を作ろうとしたのですが、私の環境とこちらのサイト主様の環境の違いが要因で実装できませんでした。
今回はその詰まったものを紹介したいと思います。

ソースコード

今回いいね機能を作るときにいいね機能の部分を部分テンプレートを作ってそこに入れて実装していくといった形です。
↓↓↓部分テンプレートのコード↓↓↓

<% if user_signed_in? %>
      <div class="like">
             <h3>いいね件数: <%= post.likes.count %></h3>
        <div class = 'like-button'>
          <% if current_user.liked_by?(post.id) %>
                <td><%= link_to 'いいねを外す', destroy_like_path(post), class: "like-link", method: :DELETE,remote: true %></td>
                <i class="fa fa-heart unlike-btn"></i>
           　 <% else %>
                <td><%= link_to 'いいね', create_like_path(post), class: "like-link", method: :post, remote: true %></td>
                <i class="fa fa-heart like-btn"></i>
          <% end %>
       </div>
    </div>
<% end %>

として、きちんとremote: trueをきちんとつけたのですが、javasctiptのところでエラーになってしまいます。

javascriptのコードを載せておきます
いいねを付ける部分のコード

document.getElementById('post_<%= @post.id %>').innerHTML = '<%= j(render @post) %>'

いいね取り消しの部分に関するコード

document.getElementById('post_<%= @post.id %>').innerHTML = '<%= j(render @post) %>'

なぜだめだったのか

投稿一覧ページ荷いいね機能を載せようと思ったのですが、底の部分で、javasctiptを呼び出す部分のidを記述していたところに問題がありました

<div class="content-wrapper">
    <div class="content-block">
        <% @posts.each do |post| %>
        <div class="content">
         <div class="user-about">
             <div class="image">
             <% if post.user.image.attached? %>
             <%= image_tag post.user.image %>
                <% else %>
            <%= image_tag 'no.user.png' %>
                <% end %>
             </div>

         <div class="profile">
            <div class="name-history">
                <div class="name">

                <%= post.user.nickname %>


                </div>
                <div class="mania-histry">
                    <%= "学習歴:#{post.user.mania_histry}年" %>
                </div>
             </div>
             
             <div class="enjoy-point">
             <%= "楽しいポイント#{post.user.enjoy_point}"%>
             </div>
         </div>
       </div>
       
       <div class="text">
        <p><%= post.content %></p>
    </div>
        <% if post.images.attached? %>
        <% post.images.each do |image| %>
            <div class = 'images'>
                <%= image_tag image, class: "content-image" %>
            </div>
        <% end %>
        <% end %>

         <div class="action-menu">
         <tr id="post_<%= post.id %>">
         <%= render 'post', post: post %>
        </tr>
             <div class="comment">
                <h3>コメント件数: <%= post.comments.count %></h3>
                <%= link_to "コメントする", "/posts/#{post.id}", class: "comment-buttom" %>
             </div>
             <%if user_signed_in?%>
             <% if current_user.id == post.user.id %>
             <%= link_to "編集", edit_post_path(post) %>
             <%= link_to "削除", post_path(post), method: :delete %>
             <% end %>
             <% end %>
 
         </div>

        </div>
        <% end %>


    </div>
    <div class="sidebar">
    <%= render 'shared/menu'%>

    </div>
</div>

となっていました。ここでの動かなかった原因なのですが、

         <tr id="post_<%= post.id %>">
         <%= render 'post', post: post %>
        </tr>

となっていましたが、trとなっている部分を

         <div id="post_<%= post.id %>">
         <%= render 'post', post: post %>
        </div>

というふうにdivタグで囲うことで成功しました。

原因

javasctiptを記述していたファイルのところなのですが、
innerHTMLはもしかしたらdivタグじゃないと取得することができないのではないかと思いました。
それでpost_idが読み取られなくて使うことができなかったのかと思います。
間違っていたらすいません