Как правильно скрыть элементы для экономии ресурсов на прорисовку?
 

Есть у меня каталог с кучей товаров, где я реализовал изменение вида информационной формы товара на jquery, но из-за того, что товаров много, браузер тратит ресурс на отрисовку изменений в реальном времени. Мне нужно сделать так, что бы во время изменения вида формы каждого товара - основной родительский элемент каталога скрывался.
Не знаю как это сделать правильно.

Пробовал что-то вроде:

$('.view-taxonomy-term .prd').each(function(){
            $(this).hide();
            var wrapContent = $(this).find('.gdsc').children();
            $(this).find('.gdsc').replaceWith(wrapContent);

            $revtitlereplace = $(this).find('.title').clone();
            $(this).find('.title').remove();
            $(this).find('.pic img').after($revtitlereplace);

            $revgreybtnreplace = $(this).find('.btn.grey').clone();
            $(this).find('.btn.grey').remove();
            $(this).find('.add').append($revgreybtnreplace);

            $revpricereplace = $(this).find('.price').clone();
            $(this).find('.price').remove();
            $(this).find('.pic').after($revpricereplace);
            $(this).show();
});

Но, кажется мне, что действия эти происходят одновременно и мои hide() и show() в начале и конце ничего не дают т.к. происходят одновременно со всеми остальными действиями.

Подскажите, как сделать правильное скрытие элементов, затем отработку действий, а затем появление элементов?