I want to create a button to change the order of the elements in the table.

I'd like to write a button process in jQuery that moves the top element to the bottom as shown below, but how should I write it?
I would appreciate it if you could let me know.

 1 2 3
2　　　3　　　4
3   →  4　 →  5
4　　　5　　　1
5　　　1　　　2

HTML code:

<div class="contents contents --table">
        <div class="table_title">Table </div>
        <div class="table"></div>
        <divid="div-a"> 1st</div>
        <divid="div-b">Second</div>
        <divid="div-c">Third</div>
        <divid="div-d">4th</div>
    </div>
    <button class="tabledown">move</button>

html jquery

2022-09-30 15:48

1 Answers

Whether you only want to sort HTML elements or want to know how to do it in jQuery I couldn't tell from the question, so I'll write about sorting HTML elements

 document.querySelector('.tabledown').onclick=function(){
  varel= document.querySelector('div.content>div.table') .nextElementSibling
  varp=el.parentElement
  p.removeChild(el)
  p.appendChild(el)
}

<div class="contents contents --table">
        <div class="table_title">Table </div>
        <div class="table"></div>
        <divid="div-a"> 1st</div>
        <divid="div-b">Second</div>
        <divid="div-c">Third</div>
        <divid="div-d">4th</div>
    </div>
    <button class="tabledown">move</button>

2022-09-30 15:48

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656