Article

Target an item and append it to the bottom.

https://cdn.jsdelivr.net/npm/[email protected]/dist/js.cookie.min.js
Copy to clipboard

To append an item to the bottom of the page, after the button, we do: https://raw.githubusercontent.com/finsweet/jqueryCourse/main/collection%20list/ex4.js?actionable=true In the above code, we use .w-dyn-item and append to add the manager item to the bottom of the blue bordered div.

<script>
$(document).ready(function(){
  XT1
});
</script>
Copy to clipboard
Send to Live Demo

Live demo

<div id="minidivpage" class="example-live"><div class="collection-list-wrapper w-dyn-list"><div role="list" class="w-dyn-items demo-items"><div role="listitem" class="collection-item w-dyn-item"><div class="position">Manager</div><div>Matt Macey</div></div><div role="listitem" class="collection-item w-dyn-item"><div class="position">CEO</div><div>Chris Mills</div></div><div role="listitem" class="collection-item w-dyn-item"><div class="position">COO</div><div>Justin Willis</div></div><div role="listitem" class="collection-item w-dyn-item"><div class="position">CTO</div><div>Daphne Norris</div></div><div role="listitem" class="collection-item w-dyn-item"><div class="position">Manager</div><div>Eleanor Mendez</div></div></div></div><a id="filter" href="#" class="w-button">Click!</a></div>

<script>    
$(document).ready(function() {
  XT1
});
</script>
<script>
  
</script>
Copy to clipboard
Press the Run Demo button to execute the scripts above.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Your browser is too small

Resize your browser to be at least 769px wide.