How to add a block to the appeared fancybox block?

Question

JavaScript

Added magnification of fancybox images for product. When enlarged, the image opens and a block is added to the html of the page:

<div class="fancybox" style="transform: translate(0px, 0px);">
  <div class="fancybox-placeholder" >
    <img class="fancybox-image" src="/catalog/Goods/0001/21345342.jpg">
  </div>
</div>

I'm trying to add an additional block with text to a block with the fancybox-placeholder class before the img script:

$(".mainimage").click(function () { //ID кнопки для увеличения
    $(".fancybox-placeholder").append('<div>Текст нужный</div>'); //Добавление блока перед img
  });

Is it possible to add an additional child block to each existing element immediately AFTER the enlarged image window appears .fancybox-placeholder, or after clicking add?

Answer 1

Did you mix up the class with id?

$(".mainimage").click(function () { //ID кнопки для увеличения
    $(".fancybox-placeholder").append('<div>Текст нужный</div>'); //Добавление блока перед img
  });