How to create div? of multiple different class dynamically by jquery Let the value of class increase by itself.

now I want to click this button and let it create a div,str every time it clicks. It is a tag that I create dynamically. I want to increase the log-1 of class in turn, log-2,log-3. Do you want to cycle around? 

$(".waveform-main").on("click",function(e){
           
        var num=1;
           
        var str="<div class="waveform-log log-"+num+"">"+
                     "<div class="tag1">"+num+"</div>"+
                     "<div class="tag2"></div>"+
                     "<span class="line-add"></span>"+
                     "<span class="icon-times"></span>"+
                     "<span class="icon-arrows-h"></span>"+
                 "</div>";
            
           
            
         $("-sharpwaveform-main-div").append(str); 
    });
Html5 css html javascript
Sep.16,2021

you don't need a loop, but your num has to be put on the outside, and inside it, it revar num=1; every time, and the num will always be 1

. 
var num=1;
$(".waveform-main").on("click",function(e){
           
        
           
        var str="<div class='waveform-log log-"+num+"'>"+
                     "<div class='tag1'>"+num+"</div>"+
                     "<div class='tag2'></div>"+
                     "<span class='line-add'></span>"+
                     "<span class='icon-times'></span>"+
                     "<span class='icon-arrows-h'></span>"+
                 "</div>";
            
           
            
         $("-sharpwaveform-main-div").append(str); 
         numPP;
    });

that num can be placed on the DOM where you bind the event using jQ, for example: 

$(".waveform-main").on("click",function(e){
    var num = $('-sharpwaveform-main-div').data('num');
    num = num ? num : 1; //data-

    var str="<div class='waveform-log log-" + num + "'>" +
                "<div class='tag1'>" + num + "</div>" +
                "<div class='tag2'></div>" +
                "<span class='line-add'></span>" +
                "<span class='icon-times'></span>" +
                "<span class='icon-arrows-h'></span>" +
            "</div>";
    $(str).appendTo("-sharpwaveform-main-div");
    
    num+=1;
    $('-sharpwaveform-main-div').data('num', num);
});

Previous: How do you tell if the content of a string is numeric?

Next: I want to nest the dialog box in iview, confirm the dialog box point, and issue another dialog box, but make sure that the button events overlap. What should I do?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb7cf3-2680.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb7cf3-2680.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?