Question

Trying to create a method that will count the amount of matching elements between a start and end element. Nothing too wild. Turns out those two console.log’s I have in the middle identifying next_item and end_elem crash my browser in an endless loop. Ideally I’m trying to have that within the while loop call so that I can prevent it from going past the end_elem once it catches it by doing next_item.index() < end_elem.index(), but that evidently destroys my browser everytime. I have no idea why.

  find_the_count_of_elements_between_two_elements: function(class_to_count, start_elem, end_elem) {
    var number_of_times = 0;
    var start = 0;
    var end = 1;
    next_item = start_elem.nextAll().slice(start, end);

    while ( start < 6 ) {

      // console.log(next_item.index() < end_elem.index() );
      console.log("next_item : " + next_item.index() );
      console.log("end_elem : " + end_elem.index());

      if ( next_item.hasClass(class_to_count) ) {
        number_of_times++;
      };

      start++;
      end++;
      next_item = start_elem.nextAll().slice(start, end);
      console.log(next_item);
    };
    return number_of_times;
  },

Answer 1

Declaring JQuery objects as global (ie without var) seems to confuse certain browsers, so it’s always a good idea to declare them local to your functions.

Note: I’m glad this information helped, but if someone can actually explain why this happens, they deserve the solution mark, not I.