How to add/remove element in an array on click?

You'll need to remove the class "available" after you push the new ID. I'm not well versed in JQuery, but it would look something like this:

if ($(this).hasClass('available')){
      code = jQuery(this).attr("id");
      ids.push(code);
      $div.append(code + "<br />");
      console.log(code);
      //REMOVE AVAILABLE CLASS
      $(this).removeClass("available");
    }

You'll probably need to re-add the class when you run your else statement (assuming you want to make an "unavailable" seat become "available" when you click it).

You will also need some logic to remove the seatID from your array when you go from "unavailable" (in the array) to "available" (not in the array)

You can use toggleClass() function of Jquery in order to do that.

for example, if u want to remove or add class "available" and "selected", the following code would work well.

$('#x').click(function(){
  $('#x').toggleClass('available').toggleClass('selected');
})

Also, if you want to remove item from an array. you can use the following code.

const array = [12, 34, 10];

const index = array.indexOf(12);
if (index > -1) {
  array.splice(index, 1);
}

// array = [34, 10]
console.log(array);

At last, your code should be updated as following..

var ids = [];
$seatid = ids;
var status = "unavailable";

$(document).ready(function() {
var $div = $("<div id='form'></div>").appendTo(".appended"), code;

  $('.seat').click(function(){
    var id = jQuery(this).attr("id");
    if ($(this).hasClass('available')){
        code = jQuery(this).attr("id");
        ids.push(code);
        $div.append(code + "<br />");
    } else {
        const index = ids.indexOf(code);
        if (index > -1) {
          ids.splice(index, 1);
        }
        console.log('Failed');
        console.log(id);
    }                        
  });
});