Rails json型のfile_field で画像プレビューについて

Question

こんな感じのフォームに、

イメージとしては、このように画像が選択されたときにプレビューを表示させたいです。

下記記述はBlogモデルのimagesカラムのフォーム部分です。
json型なので３つフォームを置いています。
今まで１つの画像プレビューのときはこのような記述でできたのですが、
json型ではじめて実装してみて、うまくいかないのですが、
どこをどのように修正すれば実現できますでしょうか？

        <div class="file-field">
          <i class="fa fa-camera"></i>
          <%= f.label :images %>
          <p>3つまで</p>
          <%= f.file_field :images, multiple: true, id: :blog_images_1 %>
          <%= f.file_field :images, multiple: true, id: :blog_images_2 %>
          <%= f.file_field :images, multiple: true, id: :blog_images_3 %>
          <img id="blog_image_prev_1" width=200 height=200 src="#" class="blog_images_hidden_1">
          <img id="blog_image_prev_2" width=200 height=200 src="#" class="blog_images_hidden_2">
          <img id="blog_image_prev_3" width=200 height=200 src="#" class="blog_images_hidden_3">
        </div>

  //画像プレビュー
  $('.blog_images_hidden_1').hide();
  $('#blog_images_1').on('change', function (e) {
      var reader = new FileReader();
      $('.blog_images_hidden_1').fadeIn();
      reader.onload = function (e) {
          $("#blog_image_prev_1").attr('src', e.target.result);
      }
      reader.readAsDataURL(e.target.files[0]);
  });

  $('.blog_images_hidden_2').hide();
  $('#blog_images_2').on('change', function (e) {
      var reader = new FileReader();
      $('.blog_images_hidden_2').fadeIn();
      reader.onload = function (e) {
          $("#blog_image_prev_2").attr('src', e.target.result);
      }
      reader.readAsDataURL(e.target.files[1]);
  });

  $('.blog_images_hidden_3').hide();
  $('#blog_images_3').on('change', function (e) {
      var reader = new FileReader();
      $('.blog_images_hidden_3').fadeIn();
      reader.onload = function (e) {
          $("#blog_image_prev_3").attr('src', e.target.result);
      }
      reader.readAsDataURL(e.target.files[2]);
  });

よろしくお願いいたします。

Answer 1

自己解決いたしました。

　　　　 <div class="file-field">
          <i class="fa fa-camera"></i>
          <%= f.label :images %>
          <p>3つまで</p>
          <%= f.file_field :images, multiple: true, id: :blog_images %>
          <img id="blog_image_prev_1" width=200 height=200 src="#" class="blog_images_hidden_1">
          <img id="blog_image_prev_2" width=200 height=200 src="#" class="blog_images_hidden_2">
          <img id="blog_image_prev_3" width=200 height=200 src="#" class="blog_images_hidden_3">
        </div>