Use CodeMirror editor for each CSS and HTML on the identical web page

I’m making an attempt to load the CodeMirror editor for use in a plugin backend. Some textareas are for HTML and a few are for CSS. I’m fairly new to WP development, so pardon my ignorance, however doing this:

    add_action('admin_enqueue_scripts', 'joermo_enqueue_scripts');
    operate joermo_enqueue_scripts($hook) {
        $joermo_html_code['ce_html'] = wp_enqueue_code_editor(array('kind' => 'textual content/html'));
        $joermo_css_code['ce_css'] = wp_enqueue_code_editor(array('kind' => 'textual content/css'));
        wp_localize_script('jquery', 'joermo_html_code', $joermo_html_code);
        wp_localize_script('jquery', 'joermo_css_code', $joermo_css_code);

        wp_enqueue_script('wp-theme-plugin-editor');
        wp_enqueue_style('wp-codemirror');
    }

I solely get the one that’s final declared, right here CSS. How can I get each?

That is my js:

jQuery( operate() {
    wp.ce_html.initialize(jQuery('.joermo-html-code-editor'), joermo_html_code);
} );

And HTML:

<textarea class="joermo-html-code-editor" identify="shipping_label_text">' . $shipping_label_text . '</textarea>

And likewise, is it not potential to .initzialie() a number of textareas with a shared class in a single go? Do I’ve to name each by id?