Basically I have at least 20 or more buttons and textareas like these with different class names.

<textarea class="widefat res_editor_exp2wid1" rows="10" cols="20" style="display: none;" id="<?php echo $this->get_field_id('jd1'); ?>" name="<?php echo $this->get_field_name('jd1'); ?>"><?php echo esc_attr($instance['jd1']); ?></textarea>
<button class="res_editor_btn_exp2wid1" type="button">Edit Content</button>

What I’m doing is expanding the textarea after clicking the button. By doing –

jQuery(document).on('click', '.res_editor_btn_exp2wid1', function(){

    jQuery(".res_editor_exp2wid1").toggle("slow").click(function(){
        jQuery('.res_editor_exp2wid1').trumbowyg();
    });
});

Each time I have to write this jQuery which is kinda annoying and I want to make it a DRY approach. How I can achieve that ? Sorry If it sounds ridiculous I’m quite novice in this matter. Any help would be appreciated.

Read more here: How to apply DRY approach on multiple jQuery button toggle


Solution:

If you know the solution of this issue, please leave us a reply in Comment section, to update the question.


Wordpress related questions and answers: