<div>
<ul>
  <button>button</button>
</ul>
</div>
      $(function() {
        $("button").click(function() {
         $("ul").before('<div>before</div>')
         $("ul").after('<div>after</div>')
         $("ul").prepend('<span>prepend</span>')
         $("ul").append('<span>append</span>');
         $("ul").css("background-color","#218838");
         $("div").css("background-color","#de77c7");
        });
      });

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js