JQuery тумблер не работает при использовании одной кнопки, чтобы скрыть и показать содержимое

Question

Я использую Jquery в своем приложении rails.Где я пытаюсь переключать комментарии в моем приложении блога.Переключатель должен быть через ту же кнопку и должен изменить текст с «Скрыть комментарии» на «Показать комментарии», как только он скрывает комментарий.

В application.js у меня есть такой код

$(document).ready(function(){
  $('#togButton').click(function(){
    $('.comment').toggle();
    if $('#togButton').text() == 'Hide Comments' {
        $('#togButton').text('Show Comments');
    } else {
        $('#togButton').text('Hide Comments');
    }
  });
});

В моем файле просмотра у меня есть СОДЕРЖАНИЕ, ЧТОБЫ СКРЫТЬ ЗДЕСЬ

<p class="comment">
  <strong>Commenter:</strong>
  <%= comment.commenter %>
</p>

<p class="comment">
  <strong>Comment:</strong>
  <%= comment.body %>
</p>

<p class="comment">
  <%= link_to 'Destroy Comment', [comment.article, comment],
               method: :delete,
               data: { confirm: 'Are you sure?' } %>
</p>

and THE BUTTON IS HERE

<p>
  <strong>Title:</strong>
  <%= @article.title %>
</p>

<p>
  <strong>Text:</strong>
  <%= @article.text %>
</p>




<h2>Comments</h2>
<%= render @article.comments %>
<button id="togButton">Hide Comments</button> 
<h2>Add a comment:</h2>
<%= render 'comments/form' %>

<%= link_to 'Edit', edit_article_path(@article) %> |
<%= link_to 'Back', articles_path %>

Когда я нажимаю Скрыть комментарий.Ничего не происходит.Также, скажите мне, как мне отладить Jquery коды