Hellow Everyone,

I've been trying to replace the existing Rich Editor Spoiler Button with a custom one so that I can get rid of the alert prompt for the Spoiler Title and also to be able to insert a custom shortcode for it in the form.

My button is this one:

// Add Custom Editor Spoiler Button
add_filter("wpdiscuz_editor_buttons", function ($editorButtons, $uniqueId) {
    $editorButtons[] = ["class" = "ql-bu-spoiler", "title" ="Spoiler", "value" ="", "name" ="bu-spoiler", "svg" ="SPOILER"];
    return $editorButtons;
}, 10, 2);

I'm having trouble detecting the current editor, simple events like this:

$("#wpdcom .wpd-form-wrapper .ql-toolbar .ql-bu-spoiler").on("click",(function(){
    console.log('spoiler button clicked');
}));

Are only working on the main form. I've tried several ways to detect the current used editor, searching the DOM for them, or using "on change" and event handlers for the form-wrappers and the editors but for some reason I can't make it work.

Then I've tried to tap into wpDiscuz AJAX and also tried to use wpdiscuzAjaxObj but it's just not working... I'm missing something and I can't figure it out without some guidance. The API docs don't have what I need and I don't want to start replicating wpDiscuz functionallity from the main WpdEditor JS classes or Quill, it's just not a good approach since the functionallity is already there.

Please send me in the right direction, or better yet, provide me with the proper code to detect the editors and apply stuff to them, particullary based on editor buttons click events. I do plan adding more custom buttons, not just this custom spoiler, so it's really important to make this work.

Thank you very much!