Using Tampermonkey to make an "ignore" button?

I have a script that goes as follows:

// ==UserScript==
// @name     TempleOS Ignorer with added Braed Ignoring
// @include     *://v3rmillion.net/*
// @grant    none
// ==/UserScript==

const ignore = ['189822','695729', '1797404', '1439', '1290050', '941293', '1696676', '440792', '1391811', '114505']

new Array(...document.getElementsByClassName('author'))
   .filter(author => ignore.includes(author.firstElementChild.getAttribute('href').match(/=([0-9]+)/)[1]))
   .forEach(author => author.parentElement.parentElement.parentElement.remove())

new Array(...document.getElementsByClassName('author_information'))
   .filter(author => ignore.includes(author.firstElementChild.firstElementChild.firstElementChild.getAttribute('href').match(/=([0-9]+)/)[1]))
   .forEach(author => author.parentElement.parentElement.remove())

There's a div called post-head and I want to add a button to it that takes the user's ID and adds it to the ignore const. I'm fairly new to using Tampermonkey, most of this was done by someone else and I want to make it easier to add users to this ignore list. Something like this. (Very sloppily done, but you get the idea.)

Solution

So you can try taking a look at this script I came up with real quick, and then you can try putting it into a UserScript if you'd like. I tried to keep this extremely simple and basic. Just know there are plenty of ways to accomplish this, and this isn't exactly the standard in 2022. Otherwise, you can just copy this JS code into the Dev Tools Console tab on the message board, and it should work for you.

Here is the overall summary of what this is:

HTML is just basic message board HTML, the button is added next at the bottom of the post on the left side
Loops through each .post element on the page, using jQuery .each(), get the idof the post, and the id of the author.
There are probably tons of ways to get the author/post id from the markup on this message board. I simply chose to split() the URL using = and grab the ID at the array index of [2]. Getting the id of the post was just replacing the post_ from the id element on the .post element.
Left in the console.log() so it can be tested, output an alert() notification for button onclick
Appended the markup, which was created using String Literals to the .author-controls elements. I used an <a> element instead of a <button> because I didn't want to add any CSS to make it match.

const ignore = [];

$('.post').each(function() {
  let US_pid = $(this).attr('id').replace('post_', '');
  console.log('id=post_' + US_pid);

  let US_author_id_array = $('.author_buttons > .postbit_find', this).attr('href').split('=')
  let US_author_id = US_author_id_array[2];
  console.log('author id: ' + US_author_id)

  let US_ignore_btn_markup = `<a href="#post_${US_pid}" class="author_ignore" data-author-id="${US_author_id}" data-post-id="${US_pid}" onclick="javascript: ignore.push(${US_author_id}); alert('Ignored: ${US_author_id}'); console.log(ignore);">Ignore User</a>`;

  console.log(US_ignore_btn_markup);

  $('.author_buttons', this).append(US_ignore_btn_markup);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="post " style="" id="post_7747511">
  <div class="post_head" style="padding-right:5px">

    <div class="float_right" style="vertical-align: middle">
      <strong><a class="postlink" href="showthread.php?pid=7747511#pid7747511" title=""></a></strong>
    </div>
  </div>
  <div class="post_author">
  </div>

  <div class="post_content">
  </div>
  <div class="post_controls">
    <div class="postbit_buttons author_buttons float_left">

      <a href="private.php?action=send&amp;uid=454420" title="Send this user a private message" class="postbit_pm"><span>PM</span></a>

      <a href="search.php?action=finduser&amp;uid=454420" title="Find all posts by this user" class="postbit_find"><span>Find</span></a>
    </div>
    <div class="postbit_buttons post_management_buttons float_right">

      <a href="javascript:Report.reportPost(7747511);" title="Report this post to a moderator" class="postbit_report"><span>Report</span></a>

    </div>
  </div>
</div>