html.erbファイル内でjavascriptを直接書いて機能を動かしたい

いいね機能を実装する際に、html.erb内でjavascriptを直接書いて、icon_heart.svgが押されたら画像を隠して、icon_red_heart.svgを表示させるという動きをさせたいです。どのように書けば動くでしょうか？

#_likes.html.erb

<% if user_signed_in? %>
 <% if post.like_user(current_user.id) %>
  <%= button_to post_like_path(post, like), method: :delete, id: i, remote: true do %>
   <%= image_tag("icon_red_heart.svg") %>
   <span>
     <%= post.likes_count %>
   </span>
  <% end %>
 <% else %>
  <%= button_to post_likes_path(post.id), id: "like-button", remote: true do %>
   <%= image_tag("icon_heart.svg") %>
   <span>
     <%= post.likes_count %>
   </span>
  <% end %>
 <% end %>
<% else %>
<%= image_tag("icon_heart.svg") %>
<span>
  <%= post.likes_count %>
</span>
<% end %>

<script>
window.addEventListener("load", function(){
  $('#i').on("click", function(){
    $('this').hide();
  })
})

</script>

行動規範の内容に同意します

回答1件

javascriptを書きたいのであればerbの場合普通に書いて問題ないですよ！

html
1<% if user_signed_in? %>
2 <% if post.like_user(current_user.id) %>
3  <%= button_to post_like_path(post, like), method: :delete, id: "like-button", remote: true do %>
4   <%= image_tag("icon_red_heart.svg") %>
5   <span>
6     <%= post.likes_count %>
7   </span>
8  <% end %>
9 <% else %>
10  <%= button_to post_likes_path(post.id), id: "like-button", remote: true do %>
11   <%= image_tag("icon_heart.svg") %>
12   <span>
13     <%= post.likes_count %>
14   </span>
15  <% end %>
16 <% end %>
17<% else %>
18<%= image_tag("icon_heart.svg") %>
19<span>
20  <%= post.likes_count %>
21</span>
22<% end %>
23
24<script>
25  console.log('javascript')
26</script>