title: Javascript not loading correctly in Chrome
body: <p>I have a messages page where i can see them as a list. If i select each one of them, I display them in the right side of the page. For that, I have two javascript functions for "next" and "previous" buttons for the messages' page. So I have a list of messages on the screen, if I click "next", I see the next page of messages and so on.
  Everything work allright, the only problem is in Chrome, it wouldn't load the page number in a span section on the bottom of the page. This is the function for next page:</p>
  
  <blockquote>
  <pre><code>$("#next").click(function() {
  </code></pre>
  </blockquote>
  
  <pre><code>    var currentPageElem = $("#currentPage");
      var totalPagesElem = $("#totalPages");  
      var minItemElem = $("#minItem");
      var maxItemElem = $("#maxItem");
      var totalItemsElem = $("#totalItems");
      var itemsOnPageElem = $("#itemsOnPage");
      var currentPageValue = parseInt(currentPageElem.val(), 10);
  
      if (currentPageValue &lt; totalPagesElem.val()) {
          currentPageElem.val(currentPageValue + 1);
      }
  
      //the first record on the current page
      minItem = $(this).getMinItem(currentPageElem.val(), itemsOnPageElem.val());
      minItemElem.val(minItem);
  
      //the last record on the current page
      maxItem = $(this).getMaxItem(currentPageElem.val(), itemsOnPageElem.val(), totalItemsElem.val());
      maxItemElem.val(maxItem);
  
      $(this).showItems(minItem, maxItem);
  
      var pageHtml = $(".pages").html();
      $(".pages").html($(this).newPageHtml(pageHtml, currentPageElem.val()));
  }); });
  </code></pre>
  
  <blockquote>
    <p>$.fn.newPageHtml = function(pageHtml, currentPage) {</p>
  </blockquote>
  
  <pre><code>    var idx1=pageHtml.indexOf("Pagina "); 
      var idx2=pageHtml.indexOf(" / ");
      var prevPage = pageHtml.substring(idx1 + 7, idx2);
      return pageHtml.replace(prevPage, currentPage);
  };
  </code></pre>
  
  <p>This is the html code that involves the js:</p>
  
  <pre><code>&lt;input type="hidden" id="totalPages" name="totalPages" value="${totalPages}"/&gt;  
  &lt;input type="hidden" id="currentPage" name="currentPage" value="${currentPage}"/&gt;   
  &lt;input type="hidden" id="minItem" name="minItem" value="${minItem}"/&gt;   
  &lt;input type="hidden" id="maxItem" name="maxItem" value="${maxItem}"/&gt;
  </code></pre>
  
  <p>...</p>
  
  <pre><code>&lt;div class="controls"&gt;
          &lt;a class="prev" id="prev"&gt;&lt;/a&gt;
          &lt;a class="next" id="next"&gt;&lt;/a&gt;
          &lt;span class="pages"&gt;
              &lt;fmt:message key="messages.page"&gt;
                  &lt;fmt:param&gt;${currentPage}&lt;/fmt:param&gt;
                  &lt;fmt:param&gt;${totalPages}&lt;/fmt:param&gt;
              &lt;/fmt:message&gt;&lt;/span&gt;&lt;/div&gt;
  </code></pre>