Move or copy a jquery element

UPD: This construction works, but it turns out that you do not select a specific element, after which you need to put a block, but all the elements of the item class.

$('.item').eq(14).insertBefore($('.item'))

And in this example, I only need to insert the 14 element after the other element (in the example, it is also 14), but nothing happens: $('.item').eq(14).insertBefore($('.item').eq(14))

Hi! I don't understand why the .append() function doesn't work in jquery. If I select an element and write the text (string) inside append, it works like and must. Code for the example:

$('.myclass').append("<div class='otherDIV'>something</div>");

And if I select an element that I want to insert using jquery, the insertion doesn't happen:

$('.myclass').append($('.otherDIV'));

I tried using appendTo, insertAfter - they don't work either. Tell me what I'm wrong about and how you can still select an element and insert it in the right place using jquery.

Perhaps you need to outline the big picture: I'm trying to move objects in a grid. Move not in the page space, but in the markup, i.e. put after the one I need . You can view the grid on this page .

Code for moving objects:

// Проверяю, есть ли до (сзади) текущего широкого поста
//  высокий пост. Если есть, и если после него есть пустой блок,
//  я ставлю широкий пост после пустого блока, а до него (пустого
//  ставлю первый попавшийся квадратный пост из последующих

if($('.item').eq(i-1).attr('sise') == 'vertical') {
  if ($('.item').eq(i+1).hasClass('ADDED')) {

    console.log('широкий стоит после высокого');

    // начинаю перебор всех блоков после текущего
    for (let a=(i); a < $('.item').length; a++) {
      console.log('перебор начался');
      if (($('.item').eq(a).hasClass('ADDED')==false) && ($('.item').eq(a).attr('sise') == '')) {
        //ставлю перед (до) этим (широким) блоком обычный квадратный
        $('.item').eq(i).before($('.item').eq(a)); a++; i++;
        //удаляю квадратный
        $('.item').eq(a).remove();
        //ставлю текущий блок после пустого
        $('.item').eq(i).after($('.item').eq(i+1))
        //удаляю текущий блок
        $('.item').eq(i).remove();
        break;
      }
    }
  }
}

Grid code:

<div class="gallery">
  <div sise="wide" class="item">{{> post/post}}</div>
  <div sise="" class="item">{{> post/post}}</div>
  <div sise="vertical" class="item">{{> post/post-tall}}</div>
  <!-- square -->
  <div sise="wide" class="item">{{> post/post}}</div>
  <div sise="vertical" class="item">{{> post/post-tall}}</div>
  <div sise="wide" class="item">{{> post/post-double}}</div>
  <div sise="" class="item">{{> post/post}}</div>
  <div sise="" class="item">{{> post/post}}</div>
  <div sise="" class="item">{{> post/post}}</div>
  <div sise="wide" class="item">{{> post/post}}</div>
  <div sise="vertical" class="item">{{> post/post}}</div>
  <div sise="wide" class="item">{{> post/post}}</div>
  <div sise="" class="item">{{> post/post}}</div>
  <div sise="" class="item">{{> post/post}}</div>
  <div sise="" class="item">{{> post/post}}</div>
  <div sise="wide" class="item">{{> post/post}}</div>
</div>

I hope I have clearly stated