I'm using the following code to add the required attribute to a textarea tag.
HTML:

<label class="setting" data-setting="caption">
        <span class="name">Beschriftung</span>
        <textarea></textarea>
</label>

JavaScript:

jQuery(function(){
       jQuery("label[data-setting='caption']").find("textarea").prop('required',true);
});

/

When I add an image to a text field in a post wordpress opens the media modal.

When I inspect the media modal with right click -> Inspect I can navigate to the following HTML element.

<label class="setting" data-setting="caption">
        <span class="name">Beschriftung</span>
        <textarea></textarea>
</label>

How can I make my JavaScript code run the jQuery function on the media modal?

I'm using the following code to add the required attribute to a textarea tag.
HTML:

<label class="setting" data-setting="caption">
        <span class="name">Beschriftung</span>
        <textarea></textarea>
</label>

JavaScript:

jQuery(function(){
       jQuery("label[data-setting='caption']").find("textarea").prop('required',true);
});

https://jsfiddle/qp30Ljvo/

When I add an image to a text field in a post wordpress opens the media modal.

When I inspect the media modal with right click -> Inspect I can navigate to the following HTML element.

<label class="setting" data-setting="caption">
        <span class="name">Beschriftung</span>
        <textarea></textarea>
</label>

How can I make my JavaScript code run the jQuery function on the media modal?

• images
• jquery

• 1 Can you explain what you're trying to do? Should you be setting the caption somewhere in a Gutenberg object model rather than directly on the page? – Rup Commented Aug 28, 2019 at 11:38
• I'm trying to change the element <textarea></textarea> to <textarea required></textarea>. I know the jQuery syntax. I don't know how to access the page which contains the html element. – Osvald Laurits Commented Aug 28, 2019 at 11:42

1 Answer 1

(function($){
//since only one label with data-setting='caption' exists, use this selector
    $("[data-setting=caption]").children('textarea').attr('required', true);
    })(jQuery);

I'm more curious as to how adding this would affect anything since these labels are not inside a <form> element?