Carter Steinhoff Carter Steinhoff - 3 months ago 8
jQuery Question

"Next" button appearing when shouldn't

I'm have a function, below, that is comparing the text in two selectors. If the last occurrence of both of these selectors is the same, the "next" button will disappear. Currently, this is not working. I'm not sure why this is happening. Just fyi, what I'm trying to select is a schema 'itemprop' and is somewhat atypical.

Here is the fiddle -
https://jsfiddle.net/carbot3000/8qjdxsz7/3/

function showHide(){
if ( $('#areall span[itemprop="reviewBody"]').last().text().trim() == $('.review span[itemprop="reviewBody"]:visible').last().text().trim())
{
$('.next').hide();
}
else if ($('#areaall span[itemprop="reviewBody"]').first().text().trim() == $('.review:visible span[itemprop="reviewBody"]').first().text().trim())
{
$('.prev').hide();
}
}

Answer

Please change your showHide function like this.

function showHide(){
if ( $("#areaall").children().last().index() == $("#areaall .review:visible").last().index())
  {
    $('.next').hide();
  }
  else if ($("#areaall").children().first().index() == $("#areaall .review:visible").first().index()) {
    $('.prev').hide();
  }
}

Refer this Updated Fiddle