Нажатие на кнопку выполняет только одну строку кода JQuery

[ugator]

Имеется простейший самописный код, который берет номер страницы из PHP, подставляет в УРЛ, и загружает нужные блоки со страницы по УРЛ аяксом в имеющийся на странице блок.

В общем в JS и JQ я не очень, по этому код банален и прост. Нужна помощь.
Все дело в том что при нажатии на кнопку код выполняется неправильно.

$(".more").click(function() //нажимаем кнопку
{
$(".more").css('outline','5px solid red'); //показываем что кнопка нажата до выполнения кода (только для теста) - НЕ ВЫПОЛНЯЕТСЯ
var np = $("#pages").text(); //здесь берем цифру последней загруженной страницы(только для теста), по умолчанию 2 - ВЫПОЛНЯЕТСЯ
var url = location.pathname+'?PAGEN_1='+np+'&'+ ajax_nav.NavQueryString; //формируем УРЛ  - ВЫПОЛНЯЕТСЯ
$("#pompa").load( url + " .tinc" ); //Переходим по УРЛ и подгружаем оттуда нужные блоки в КЕШ блок - ВЫПОЛНЯЕТСЯ
$("#pompa").children().appendTo("#tv-list"); //Присоединяем нужные блоки в имеющийся блок - НЕ ВЫПОЛНЯЕТСЯ
$(".more").css('outline',''); //убираем добавленный эффект нажатия кнопки после выполения основного кода(только для теста) - ВОЗМОЖНО НЕ ВЫПОЛНЯЕТСЯ
$("#pages").text(Number(np) + 1); //в текущей сессии мы меняем цифру страницы на +1 и показываем что цифра увеличилась (тестовая) - ВЫПОЛНЯЕТСЯ
});

При нажатии на кнопку код получает по УРЛ нужные блоки, запихивает их в КЕШ блок - строка 4 исполяемого кода.
Полностью игнорирует другие строки кода, и не выполняет APPENDTO.
Затем сразу меняет цифру на кнопке - последняя строка исполняемого кода.
При повторном нажатии выполняется операция - appendTo, он присоединяет детей в новый блок, цифра меняется снова, но номер страницы становится уже на 1 больше чем нужно. И после второго нажатия код по преждему выполняет только два пункта.
После второго нажатия все блоки присоединяются с первого раза, но операция appendTo снова не отрабатывает, так как в КЕШ блоке данные по прежнему остаются

Помогите решить проблему. Почему после первого нажатия APPENDTO не отрабатывает? Не перемещает детей новому родителю, но при это срабатывает только после второго нажатия.

[рони]

$("#pompa").load( url + " .tinc" сюда весь остальной код);

смотреть документацию на load, медитировать над асинхронность

[ugator]

Спасибо за то что указал направление исправлейний.

Если не сложно помоги переделать код в асинхронный вариант.

[рони]

Спасибо за то что указал направление исправлейний.

Если не сложно помоги переделать код в асинхронный вариант.

сюда весь остальной код

смотреть документацию на load

[рони]

ugator,

$("#pompa").load( url + " .tinc", function() {
$("#pompa").children().appendTo("#tv-list");
// и т.д.
} );

[ugator]

$("#pompa").load( url + " .tinc", function() {
$("#pompa").children().appendTo("#tv-list");
// и т.д.
} );

с этим понятно было с первого раза. Я уже так и сделал.
А асинхронность тут просто честно не знаю каким боком. В принципе лоад он и был асинхронным. По этому не ясно как его еще можно асинхронным сделать.

[рони]

В принципе лоад он и был асинхронным

строка 6 выполнится после строки 13 и только когда браузеру придёт ответ с сервера, это и есть асинхронность.

[ugator]

В общем я многое поменял в коде и по твоей подсказке запихал часть кода в лоад. Теперь все работает как надо. Спасибо, Рони.

Осталась одна большая проблема.
Как заставить все скрипты работать на вновь загруженных блоках?
У каждого загруженного блока есть кнопки, которые само собой не работают после загрузки аяксом.
Можно конечно как то навешать на них .on(), но я не знаю как, ибо кнопки создает движок сайта, и именно он вешает свои события на каждую кнопку к каждому ID блока.
Есть возможность переподключить скрипты? или как то перезагрузить страницу с сохранением параметров. Или сделать что то еще

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

[рони]

Можно конечно как то навешать на них .on(), но я не знаю как,

$("#tv-list").on("click", "селектор вашей кнопки",  function(event) { })

[ugator]

$("#tv-list").on("click", "селектор вашей кнопки",  function(event) { })

Это немного не то.

У меня десятки блоков с классом .tinc
#tv-list - это просто контейнер который их объединяет.
Внутри каждого блока div.tinc - которые являются товарами или статьями имеются кнопки - для товара например - купить, увеличить количество, уменьшить количество. Для статей - подписаться и прочее.
Кадая кнопка товара имеет свой ID который генерируется движком, и на которые накидываются события.
По факту скрипт един для всех товаров. Один скрипт с обработкой нажатий на одну страницу. Но если подгрузить товары то этот скрипт для новых не срабатывает.

Если я повешу событие on на их контейнер - это ничего не даст