Как найти некоторые элементы в шаблоне после рендеренга страницы

Questions
1

Здравствуйте. Подскажите пожалуйста.

 {{#each mData.products}}
 **тут выводится html если есть что-то в mData.products**
 {{/each}}

А если нет ничего, то соответственно не выводится. Как затем, уже после рендеринга страницы, найти весь html шаблон , который был между {{#each mData.products}} {{/each}}

Просто столкнулся с задачей, когда нужно делать клонирование (или добавлять) ещё один блок элемента аналогичный.

Например в шаблоне из БД выводятся все списки продуктов

 {{#each mData.products}}
 **тут выводится продукция mData.products**
 {{/each}}

А если продуктов нет, то можно нажать кнопку “добавить” и на странице появляется шаблон с полями для ввода данных продуктов.

Если шаблона не большой, то проблем нет, его просто можно в 2 места поместить - и js код обработчика кнопки, и в html код для рендеринга страницы.
Либо можно использовать pageAfterIn: function(e, page) {тут сделаем вывод шаблона}

Но, хотелось бы избежать всего этого и делать просто клонирование элемента из html.

У меня просто получилось так что весь шаблон, как раз хранится в html верстке. Но, возникла необходимость в таком вот функционале.

2

Не очень понял суть проблемы, что имеется ввиду под словом “найти” в данном контексте?
Найти средствами JS/DOM?

Можно например обернуть в дом элемент/условие:

{{#if mData.products.length}}
  <div class="template-content">
  {{#each mData.products}}
  **тут выводится html если есть что-то в mData.products**
  {{/each}}  
  </div>
{{/if}}

И собственно будет содержимое в .template-content

3

Да, всё верно, если #if mData.products.length == true
тогда в <div class=“template-content”> есть html
и я могу с ним работать. Например сделать
let очень_много_верстки_html = querySelector('.template-content').innerHTML

А если #if mData.products.length == flase
Тогда в <div class=“template-content”> пусто

Соответственно мне неоткуда уже взять весь этот innerHTML, т.к. после рендеринга он исчезнет, т.к. не сработало условие #if mData.products.length == true

Например, если выводится огромный(или нет, не важно) html шаблон, то его “придётся” продублировать на странице дважды, что бы можно было откуда-то взять его разметку и одновременно использовать в
{{#if mData.products.length}}

Вот пример.
На странице в цикле выводятся формы с заполненными данными, при условии что они есть в БД. Если в БД нет форм - выводится кнопка, при нажатии на которую, создаётся пустая форма. Проблема такой кнопки что если html вёрстка очень “большая” то размер страницы увеличивается, и потом надо правки в двух места вносить.