if 语句 (jQuery)

我无法弄清楚，是什么导致10它一直显示为红色。其他数字按应有的方式显示，但10如果语句无法比较正确的值，则仅在数字上显示。

$( document ).ready(function() {
$("thead tr td:nth-child(3)").each(function(){

    var compare = $(this).text()

        if( compare == 'null' ) {
             $(this).text('No rating found').parent('tr').addClass("table-danger");
        }
          else if ( compare <= '5' ) { //Number 10 keeps comparing whit this statement       
                        $(this).parent('tr').addClass("table-danger");    
          }
          else if ( compare > '5' &&  compare < '7' ) {       
                        $(this).parent('tr').addClass("table-info");    
          }
           else if ( compare >= '7' ) {       
                        $(this).parent('tr').addClass("table-success");    
          }
     });
});

第一个else if陈述有问题。数字10应该是绿色的("table-success")

现场演示：https : //jsfiddle.net/gah1m33d/1/