title: Merge table rows based on row text and class
body: <p>I have found this function <a href="https://stackoverflow.com/a/28518034/962734"><strong>here</strong></a> and it almost perfectly suits my needs. The function iterates through the first column of a table, and row merges similar values. Then, it iterates through the next column, and row merges those values as well, while taking into account the merges of the column before it. In this way, it perfectly suits what I need.</p>
  
  <pre><code>function MergeCommonRows2(table, firstOnly) {
      var firstColumnBrakes = [];
      for (var i = 1; i &lt;= table.find('th').length; i++) {
          var previous = null, cellToExtend = null, rowspan = 1;
          table.find("td:nth-child(" + i + ")").each(function (index, el) {
              if (previous == $(el).text() &amp;&amp; $(el).text() !== "" &amp;&amp; $.inArray(index, firstColumnBrakes) === -1) {
                  $(el).addClass('hidden');
                  cellToExtend.attr("rowspan", (rowspan = rowspan + 1));
              } else {
                  if (firstOnly == 'first only') {
                      if (i === 1)
                          firstColumnBrakes.push(index);
                  } else {
                      if ($.inArray(index, firstColumnBrakes) === -1)
                          firstColumnBrakes.push(index);
                  }
                  rowspan = 1;
                  previous = $(el).text();
                  cellToExtend = $(el);
              }
          });
      }
  }
  </code></pre>
  
  <p>However, I wish to edit the function to consider classes as well. In other words, I wish to edit the function to first check the classes of the two rows being merged. And, even if they have the same value, if they have different classes, to NOT merge the rows. I have tried to edit the above function to do as much, but to no avail. </p>
  
  <hr>
  
  <p><strong>UPDATE</strong></p>
  
  <p>My attempts to edit the code were quite crude. Essentially, I put code before he <code>if</code> statement that adds a <code>hidden</code> class and said, to summarize, if <code>previous.getClass = current.getClass</code>, only then go onto the if statement that hides the class. </p>
  
  <p><a href="http://jsfiddle.net/gfdL4ay8/30/" rel="nofollow noreferrer">Here is the fiddle</a>. I want to click the merge button and, since the "click me" cells have a different classes between them, I don't want them to merge. </p>