сопоставление двух классов в Jquery

Я не уверен, что это то, что вы хотели, но, может быть, вы можете использовать его:

HTML:

<div id="left">
    <ul style="float:left;">
        <li class="font1">sfadsa</li>
        <li class="font2">sfadsa</li>
        <li class="font3">sfadsa</li>
    </ul>
</div>

<div id="right">
    <ul style="float:right;" >
        <li class="font3">sfadsa</li>
        <li class="font1">sfadsa</li>
        <li class="font2">sfadsa</li>
    </ul>
</div>

JQuery:

$('#right ul').sortable({
    stop : check
});

function check(){
    $('#right li').each(function(){
        if($(this).attr('class') == $('#left li:eq(' + $(this).index() + ')').attr('class')){
            $(this).css({'background-color':'#0f0'});
        }else{
            $(this).css({'background-color':'#f00'});
        }
    });
}

check();

Демо - версия:

http://jsbin.com/icepEMa/1

Как это решение? Это предполагает, что каждый элемент имеет только один класс:

$('ul.left li').each(function(i){
  classMatches = $('ul.right li').eq(i).hasClass($(this).attr('class'));
  if(classMatches){
    $('ul.right li').eq(i).add(this).css({color:"#F00"});
  }
});

Я также дал ваши классы <ul> и применял внешние стили CSS, во-первых, чтобы различать два в jQuery, а во-вторых, чтобы избавиться от ваших встроенных стилей.

DEMO