Выполнение по порядку
 

$("a[rel~='showinfo']").click(function () {
      var info_id = $(this).attr('id');
      
      if($('.info_name').is(':visible'))
      	remove_contact();

      for(i=0; i<contact_status.length; i++){
      	if(info_id == contact_status[i]){
      		create_contact(i);
      	}
      }
     $('.info_name').show("slide", {direction: "right"}, 1000);
     $('.info_info').show("slide", {direction: "up"}, 1000);

    });
    
    function create_contact(id){
    	$('.third').append('<div class="showinfo"><h2 class="info_name">'+contact_name[id]+'</h2><span class="info_info">lol</span></div>')
    }
    
    function remove_contact() {
        $('.info_name').hide("slide", {direction: "right"}, 1000);
    	$('.showinfo').remove();
    }

В общем как выполнить скрипт в такой последовательности:

1. Если есть info_name, то:
   1. Прячем info_name
   2. Удялаем info_name
2. Выполняем цикл
   1. Если есть совпадение, добавляем
3. Показываем всё
   1. Сначала info_name
   2. Затем info_info

Проблема в том, что оно тока появляется плавно, а мне надо ещё что бы и удалялось тоже плавно...

Добавлено через 7 минут
Да, callback не вариант, ибо в нескольких случаях добавляется сразу 2 дива и тогда ваще жопа...

$('.info_name').show("slide", {direction: "right"}, 1000, function(){
     	$('.info_info').show("slide", {direction: "up"}, 1000);
     });

Тоесть info_name норм пояляется, а info_info 2 раза почему-то...

неужеле нет никаких простых способов для реализации последовательности?

Нет, callback - вариант, ибо в нескольких случая добавления нужно их учитывать, а не слепо анимировать все элементы на странице с таким классом.

$('.info_name').show("slide", {direction: "right"}, 1000, function(){
        $('.info_info*!*:hidden*/!*').show("slide", {direction: "up"}, 1000);
});

Так я ремувил целый блок и создавал новый с id + i, а не просто id.

http://youtu.be/pc5RfxPGVv4

это с Вашим кодом так, потому что анимации помещаются в очередь. Я Вам показал пример.

блин, это именно тут пример с классами, а на видео можно рассмотреть, что там было всё с id=info_name+i и id=info_info+i. Я просто разные варианты реализации пробовал.

у меня ошибка была :) мозг уже спит

1. сделайте на классах (одинаковых)
2. фильтруйте видимые (:visible) элементы, когда необходимо что-то показать
3. фильтруйте скрытые (:hidden), когда надо что-то скрыть

та я с ид,, просто к ид i приписывал и всё, а вот как можно передать в каллбак функцию параметр? Ща оно у меня при помощи delay, но это не выход...

$('#info_name'+i).show("slide", {direction: "right"}, 1000, function(){
     		$('#info_info'+i).show('slide',{direction: "up"}, 1000)});

Внутренний i почему-то равен всегда 5 - тоесть последнему элементу массива и равен именно в калбак функции. При аппенде и первом id он нормально, а в каллбак в конце

if($('.showinfo').is(':visible')){
      		$('.info_info').hide('slide',{direction: "up"}, 1000, function(){
      			$('.info_name').hide('slide', {direction: "right"}, 1000, function(){
      				$('.showinfo').remove();
      			});
      		});
      		$('.ui-effects-wrapper').remove();
      	}

А как вот это выполнить по порядку?

1. .info_info
2. .info_name
3. .showinfo
4. .ui-effects-wrapper
5. А уже потом всё остальное, тоесть оставшийся код полсе ифа.

P.S.
Цитата с этого сайта

$('.ui-effects-wrapper').remove();

за

$('.showinfo').remove();

фиг там, появляецо ок, а убераецо половина, другая улетает куда-то6 всё пропадает, новое не появляется.