Добавление панели вкладок Jquery к определенному элементу div

Question

Я был уверен, что уже был ответ на этот вопрос, но я провел несколько часов, глядя без удачи.

Это мои основные настройки.

<div id='container'>
  <ul id="tabs">
    <li>Tab 1</li>
    <li>Tab 2</li>
  </ul>
  <div id="panels">
    <div>panel 1</div>
    <div>panel 2</div>
  </div>
</div>

Когда я динамически добавляю новую вкладку, я хотел бы, чтобы вкладка появлялась внутри div «Panel», как «Panel 1» и «Panel 2».

Однако, когда я динамически добавляю «вкладку 3» (см. Ниже), «панель 3» добавляется под вкладкой панелей, а не внутри нее.

<div id='container'>
      <ul id="tabs">
        <li>Tab 1</li>
        <li>Tab 2</li>

        <li>Tab 3</li>

      </ul>
      <div id="panels">
        <div>panel 1</div>
        <div>panel 2</div>
      </div>

      <div>panel 3</div>

    </div>

Как мне добавить мою новую панель "панель 3" в раздел "панели"?

Answer 1

Как это:

$('#panel3').appendTo('#panels');

Это будет двигаться panel3 внутри panels

Answer 2

$("#panels").append("<div> panel3</div>");