Как можно добавить data атрибут при динамическом создании элемента?

Question

[Александр]

Нужно вставить data атрибут, чтоб использовать элемент для показа модального окна
data-toggle="modal"
data-target="#modal-map-body"
при попытке добавить атрибут с дефисом, понятно выдает ошибку

вариант как с backgroundImage вместо background-image здесь не прокатывает

вариант с точкой тоже data.toggle

экранировать обратным слешем \ не помогает

$("<div/>", {
     "id": "zoom-map",
      text: "Увеличить карту",
      data-toggle: "modal",
     data-target: "#modal-map-body",
     click: function(){
          $(window.parent.document.getElementById('modal-map-body')).addClass('overlay-map').html('<iframe src="*"></iframe>');
         $(window.parent.document.getElementById('start-map')).click();
       }
 }).insertAfter("ul.map-visible-list");

Answer 1

[Алексей Ярков]

В кавычки возьмите

$("<div/>", {
     "id": "zoom-map",
      "text": "Увеличить карту",
      "data-toggle": "modal",
     "data-target": "#modal-map-body",
     click: function(){
          $(window.parent.document.getElementById('modal-map-body')).addClass('overlay-map').html('<iframe src="*"></iframe>');
         $(window.parent.document.getElementById('start-map')).click();
       }
 }).insertAfter("ul.map-visible-list");

Comments

[Александр]

спасибо, так просто :)

Answer 2

[Maa-Kut]

$('<div/>', { ... }).insertAfter("ul.map-visible-list").data('toggle', 'modal').data('target', "#modal-map-body");