Trouble appending buttons in the workspace!

Ive been over a bunch of code examples and I cant seem to find my error. the button simply wont show up. If there is a problem with this code, id be thankful to have it pointed out to me. Otherwise it looks like somethings buggy :\ I had the same issue in a previous workspace example.

// 1: Set the text of the <h1> element

let h1 = document.querySelector('h1');
h1.textContent = 'Things I DO';

// 2: Set the color of the <h1> to a different color

h1.style.color = 'blue';

// 3: Set the content of the '.desc' paragraph // The content should include at least one HTML tag

const desc = document.querySelector('.desc');
desc.innerHTML = "things i want to do <i>today</i>";

// 4: Set the class of the <ul> to 'list'

let ul = document.querySelector('ul');
ul.className = "list";

// 5: Create a new list item and add it to the <ul>

let li = document.createElement('li');
li.innerHTML = '<input> Cook';
ul.appendChild(li);

// 6: Change all <input> elements from text fields to checkboxes

const ins = document.querySelectorAll('input');
for (i = 0; i <= ins.length; i++){
  ins[i].type = 'checkbox';
}

// 7: Create a <button> element, and set its text to 'Delete' // Add the <button> inside the '.extra' <div>

const buttonDelete = document.createElement('button');
buttonDelete.textContent = 'Delete';

const extra = document.querySelector('.extra');
extra.appendChild('buttonDelete');