railsで別のページから飛んで来た時に動かないjavascriptをどうにかしたい

rails
1Rails.application.routes.draw do
2  root 'pages#index'
3  get 'pages/:id', to: 'pages#show'
4  get 'recipe/:id', to: 'posts#show'
5  get 'recipe/:id/edit', to: 'posts#edit'
6  resources :posts,          only: [:create, :destroy, :new, :update]
7html
8end

html
1<%= render 'layouts/modal' %>
2<!-- post form -->
3<div class="post_page_content flex">
4  <div class="post_new_wrapper flex">
5    <div class="post_wrapper">
6      <%= form_for(@post) do |f| %>
7      <div class="field">
8       <%= f.text_field :title %>
9      </div>
10      <div class="flex">
11        <div class="field">
12          <div class="image_box">選択されたファイルがプレビューされます</div>
13          <%= f.file_field :recipe_image, class:'hidden_image' %>
14          <%= f.hidden_field :recipe_image_cache %>
15          <div id="preview" class="preview"></div>
16          <button class="delete_btn">消去</button>
17        </div>
18        <div class="material_and_quantity_box">
19          <div>材料・分量(2人前)</div>
20          <div class="flex material_target_form">
21            <div id="insert_materials">
22              <div class="field insert_materials">
23                <p id="edit_material_and_quantity">クリックして編集</p>
24              </div>
25            </div>
26            <div id="insert_quantity">
27              <div class="field insert_quantity">
28              </div>
29            </div>
30          </div>
31        </div>
32      </div>
33      <p>作り方</p>
34      <div class="flex process_target_form">
35        <div class="field insert_process">
36          <div>1.</div>
37          <textarea cols="10" rows="5" class="process_form_input" placeholder="クリックして作り方を入力"></textarea>
38        </div>
39        <div class="field insert_process">
40          <div>2.</div>
41          <textarea cols="10" rows="5" class="process_form_input" placeholder="クリックして作り方を入力"></textarea>
42        </div>
43        <div class="field insert_process">
44          <div>3.</div>
45          <textarea colsRails.application.routes.draw do
46  devise_for :users, controllers: { omniauth_callbacks: 'users/omniauth_callbacks',
47                                    registrations: "users/registrations"
48                                  }
49  root 'pages#index'
50  get 'pages/:id', to: 'pages#show'
51  get 'recipe/:id', to: 'posts#show'
52  get 'recipe/:id/edit', to: 'posts#edit'
53  resources :posts,          only: [:create, :destroy, :new, :update]
54  resources :pages,          only: [:destroy]
55  # For details on the DSL available within this file, see https://guides.rubyonrails.org/routing.html
56end``````ここに言語を入力
57ここに言語を入力

コード

        </div>
        <div class="field insert_process">
          <div>4.</div>
          <textarea cols="10" rows="5" class="process_form_input" placeholder="クリックして作り方を入力"></textarea>
        </div>
      </div>

javascript
1document.addEventListener("DOMContentLoaded", function () {
2  const add_form_html = () =>
3    '<tr class="add_form">' +
4    "<th>" +
5    '<input type="text" placeholder="材料" class="material" /> ' +
6    '<input type="text" placeholder="分量" class="quantity" /> ' +
7    '<span class="form_plus">+</span> ' +
8    '<span class="form_minus">-</span> ' +
9    "</th>" +
10    "</tr>";
11  const add_form_html_process = () =>
12    '<tr class="add_process_form">' +
13    "<th>" +
14    '<textarea cols="25" rows="2" class="process_form_input"></textarea>' +
15    '<span class="form_plus">+</span>' +
16    '<span class="form_minus">-</span>' +
17    "</th>";
18
19  function handleAdd(e) {
20    if (e.target.classList.contains(this.name)) {
21      if (this.select == ".add_form" && material_form_count < max_count) {
22        material_form_count += 1;
23        e.target.closest(this.select).insertAdjacentHTML("afterend", this.form);
24        let set_top_px = (material_form_count - 1) * 19.5 - 300;
25        modal_content.style.top = set_top_px + "px";
26        if (material_form_count >= max_count) {
27          this.error.style.display = "block";
28        }
29      } else if (
30        this.select == ".add_process_form" &&
31        process_form_count < max_count
32      ) {
33        process_form_count += 1;
34        e.target.closest(this.select).insertAdjacentHTML("afterend", this.form);
35        let set_top_px = (process_form_count - 1) * 27.5 - 300;
36        modal_process_content.style.top = set_top_px + "px";
37        if (process_form_count >= max_count) {
38          this.error.style.display = "block";
39        }
40      }
41    }
42  }
43
44  function handleMinus(e) {
45    if (e.target.classList.contains("form_minus") && material_form_count != 1) {
46      e.target.closest(".add_form").remove();
47      material_form_count -= 1;
48      let set_top_px = (material_form_count - 2) * 19.5 - 300;
49      modal_content.style.top = set_top_px + "px";
50    }
51  }
52  function handleMinusProcess({ target }) {
53    if (target.classList.contains("form_minus") && process_form_count != 1) {
54      target.closest(".add_process_form").remove();
55      process_form_count -= 1;
56      let set_top_px = (process_form_count - 1) * 27.5 - 300;
57      modal_process_content.style.top = set_top_px + "px";
58    }
59  }
60  table.addEventListener("click", {
61    name: "form_plus",
62    select: ".add_form",
63    count: material_form_count,
64    error: form_count_error,
65    form: add_form_html(),
66    handleEvent: handleAdd,
67  });
68
69  process_table.addEventListener("click", {
70    name: "form_plus",
71    select: ".add_process_form",
72    count: process_form_count,
73    error: process_counter_error,
74    form: add_form_html_process(),
75    handleEvent: handleAdd,
76  });
77  table.addEventListener("click", handleMinus);
78  process_table.addEventListener("click", handleMinusProcess);
79});