"this" is not working show_siblings
function addHeading(){
$(".content").append("<h1 class='content_heading'>Heading <span onclick='show_siblings()' ><svg xmlns='http://www.w3.org/2000/svg' height='18' width='20'><path d='M5.688 11.083q-.459 0-.771-.323-.313-.322-.313-.76 0-.458.323-.771.323-.312.761-.312.458 0 .77.323.313.322.313.76 0 .458-.313.771-.312.312-.77.312Zm4.312 0q-.458 0-.771-.323-.312-.322-.312-.76 0-.458.323-.771.322-.312.76-.312.458 0 .771.323.312.322.312.76 0 .458-.323.771-.322.312-.76.312Zm4.312 0q-.458 0-.77-.323-.313-.322-.313-.76 0-.458.313-.771.312-.312.77-.312.459 0 .771.323.313.322.313.76 0 .458-.323.771-.323.312-.761.312Z'/></svg><div class='contentChildOptions'><button>Copy</button><button>Duplicate</button><button>Delete</button></div></span> </h1>");
$(".content_heading").attr("contentEditable","true");
$(".content_heading > *").attr("contentEditable","false");
document.getElementById("heading_options").style.display = "block";
}
function show_siblings(){
$(this).children().toggleClass("showElement");
```this`` reference missing in your code
function show_siblings(){
$(this).children().toggleClass("showElement");
See the example I demystifying this and that keyword
let element1 = document.getElementById("element1");
let element2 = document.getElementById("element2");
let toggle = true;
function toggleFunc( that ) {
toggle = !toggle;
that.setAttribute("data-show", toggle );
}[data-show="false"] {
color: red
}
[data-show="true"] {
color: green
}<div id="toggle" onclick=toggleFunc(this)>Click here: 1</div>
<div id="showElement" onclick=toggleFunc(this)>Click here: 2<div>