javascript - 配列キー変数は変更されていますが、変数データは変更されていません

Question

非常に単純な画像ギャラリー ビューアーを作成しようとしていますが、配列とそのデータで何かが正しく機能していないため、配列キーの変更にページが応答しません。私が欲しいのは、next-buttonまたはprevious-buttonをクリックすると、キーにある変数がページに表示される情報とともに変化することです。これが私のコードです

HTML

<div id="gallery">
  <div id="gallery-control-bar">
    <div id="gallery-buttons" class="control-bar-item">
      <div id="previous-button" class="gallery-button">&larr;</div>
      <div id="next-button" class="gallery-button">&rarr;</div>
    </div><!-- "#gallery-buttons" -->
    <div id="image-index" class="control-bar-item">
      <span id="current-post">1</span> of <span id="post-total">29</span>
    </div><!-- "#image-index" -->
    <div id="gallery-type" class="control-bar-item">
      <img id="gallery-switch" alt="Gallery Icon" src="images/gallery-icon.png">
    </div>
  </div><!-- "#gallery-control-bar" -->

  <div id="gallery-image"></div>
</div><!-- "#gallery" -->

JS (ここに問題があると思います)

var currentImg = 0;
var totalImg = js_p_id.length - 1;

var userCurrent = currentImg + 1;
var userTotal = js_p_id.length;

$("#next-button").click(function() {
    if (currentImg == totalImg) {
        currentImg = 0;
    }
    else {
        currentImg++;
    }
    return;
});

$("#previous-button").click(function() {
    if (currentImg == 0) {
        currentImg = totalImg;
    }
    else {
        currentImg--;
    }
    return;
});

$("#gallery-image").html("<img src='" + js_p_src[currentImg] + "'>");
$("#gallery-title").html(js_p_title[currentImg]);
$("#gallery-medium").html(js_p_medium[currentImg]);
$("#gallery-size").html(js_p_size[currentImg]);
$("#gallery-date").html(js_p_date[currentImg]);

$("#current-post").html(userCurrent);
$("#post-total").html(userTotal);

プレフィックス付きの変数はjs、別のスクリプトで JSON を使用して PHP から JS に変換された配列であり、正常に機能しており、問題はありません。技術的には、前のボタンと次のボタンをクリックするたびに画像とその情報が切り替わるはずですが、そうではありません。すべての変数にアラートを設定し、ボタンを押すとすべてが変化しますが、ページ上の画像/情報は同じままです。ここで何が間違っていますか？