Adding DOM element with JQuery

Asked Nov 11 '18 at 15:52

Active Nov 11 '18 at 15:52

Viewed 42 times

I'm trying to add DOM element with using JQuery in that way:

 $("<label/>", {

    "class": "switch",  

       on:{

          click: function(event){

          let currentBlock =  $(this).parents('.item');

          if($(this).find('input[type=checkbox]'){
            currentBlock.toggle('inactive')
          }
          else{
            currentBlock.toggle('inactive')              
          }
      },

      append: '<input type="checkbox"><span class="slider round"></span>',

      appendTo: context

  });

And it work like a charm, but I can append to this block only one element.

I mean that piece of code:

append: '<input type="checkbox"><span class="slider round"></span>'

I tried to find in which way I can add a few elements, put theare Array or Object...but it does not work :(

Anyone has similar problem?

asked Nov 11 '18 at 15:52

Re_p1ay

Do you wanna share your HTML too and make a [mcve]? It will be more helpful. – Praveen Kumar Purushothaman Nov 11 '18 at 15:54
And what else do you want to add? – charlietfl Nov 11 '18 at 16:02
@PraveenKumarPurushothaman I am not sure that I can add the piece of Angular project to jsfiddle.net, but I gonna try – Re_p1ay Nov 11 '18 at 16:13
1

@Re_p1ay Sure. That will be helpful. Also, why are you mixing Angular and jQuery? That's a dangerous combination. – Praveen Kumar Purushothaman Nov 11 '18 at 16:14
@charlietfl in that way I want create a div wich will have some paragrafs, inputs and spans Here is an example of my JQ code adding div https://jsfiddle.net/Rep1ay/tzvpf068/1/ – Re_p1ay Nov 11 '18 at 16:23
@PraveenKumarPurushothaman with mechanics of working an Angular with JQ in that moment I haven't a problem...here a question more about JQ and not about Angular – Re_p1ay Nov 11 '18 at 16:27
Strongly suggest reading [thinking-in-angularjs-if-i-have-a-jquery-background](https://stackoverflow.com/questions/14994391/thinking-in-angularjs-if-i-have-a-jquery-background) I agree with Paveen, not a good mix – charlietfl Nov 11 '18 at 16:34
@charlietfl thank you for a good article, do you think Angular 6 can have same problems? – Re_p1ay Nov 11 '18 at 16:43
And question is still about JQuery :) – Re_p1ay Nov 11 '18 at 16:44
Yes. Use angular templating for what you are doing – charlietfl Nov 11 '18 at 16:46
Thank you guys, I will think about Angular templating. – Re_p1ay Nov 11 '18 at 17:11

Adding DOM element with JQuery

0 Answers0