Как передать значение из инпута в объект jQuery при событии change?

Question

[75db77]

Внутри $singleDesignWrapper находится инпут. Мне нужно получить значение этого инпута при событии change и поместить его в содержимое <p class="sidebar-design-name"></p>.

Что-то похожее сделано в строке:

$('.sidebar-design-number', $element).text('Дизайн ' + (i+1));

В общем, цель такова:
есть вложенные формы дизайнов, и мне нужно динамически заполнять значения в sidebar из инпута, находящегося в .field-name-field-design-name. Инпут не является прямым потомком .field-name-field-design-name.

Код:

const $singleDesignWrapper = $(
      ".field--name-field-design .field--name-field-design-name"
    );

    $singleDesignWrapper.each(function(i) {

      console.log($(this));

       // Объект, куда мне нужно поместить значение    
      const $element =
        $('<div class="sidebar-designs-wrapper">\n' +
        '  <div class="sidebar-single-design-container">\n' +
        '    <div class="sidebar-design-number-and-name">\n' +
        '      <p class="sidebar-design-number"></p>\n' +
        '      <p class="sidebar-design-name"></p>\n' +
        '    </div>\n' +
        '    <p class="sidebar-garments-locations-count"></p>\n' +
        '  </div>\n' +
        '</div>');

      $('.sidebar-design-number', $element).text('Design ' + (i+1));
      $sidebarDesignsWrapper.append($element);

    });

console.log($(this));показывает четыре объекта.
console.log($(this).length); === 1

HTML выглядит так::

<div class="sidebar">
  <div class="button-container current-step"></div>
  <div class="sidebar-designs-wrapper">
    <div class="sidebar-single-design-container">
      <div class="sidebar-design-number-and-name">
        <p class="sidebar-design-number"></p>
        <p class="sidebar-design-name"></p>
      </div>
      <p class="sidebar-garments-locations-count"></p>
    </div>
</div>

<div class="main">
  <div class="field--name-field-design">
    <div class="field--name-field-design-name">
      <div class="js-form">
        <input type="text" value="hello">
      </div>
    </div>
  </div>
  <div class="field--name-field-design"></div>
</div>