Ammending gallery module js slick setting + changung the caption entity

[simonp]

After reading the following blog

https://community.hubspot.com/t5/CMS-Development/Custom-Gallery/td-p/6141

I after some help on ammending the standard image gallery

1st question is based on the incomplete answer about overiding the settings in slick js initializing  script the code basically is as follows

 I am ruung the following after the initializing:

(function($) {
      $(document).ready(function() {
             $("#hs_cos_gallery_module_159544116298339_Gallery").hsSlick( {
            arrows:false
         });
       });
})(hsjQuery);

The code mirrors the settings

But has no effect.

The other thing i like to ask is is about  changing the caption entity. The caption entity is a rich text field - of which  i have successfully input html/inline css -  so I have an  image and some associated layout.

But ideally rather than crowbar code into the captition field I would like to have a series of associated fields that i can combine into a html/css layout 

[simonp]

It seems to extend the caption value basically i can create the required markup and add additional field then change the code

{{ slides.append({ "caption": slide.caption,.....

 to something like this - where i can create the subsequent fields and amrkup and insert into "caption" thats added to the slides array

{% set captionHTML = "<h2>Hello</h2>" + slide.caption %}

{{ slides.append({ "caption": captionHTML,....

=========================================

Is there an easy way of building a html string