Search code examples
javascriptjqueryhtmlloopsround-slider

Append elements on value


I'm using roundSlider for radial slider. Which gives me value on slide. on slide I'm appeding span elements.

So what I want exactly is span should as per plates number. If there are 22 plates so span should be only 22 and if plates are 10 then span should also be 10 or vice-versa.

Find Fiddle Demo

Currently, It's just appending in 1 length. I want it to append (add and remove) as per var tp value.

var tp = $('.rs-tooltip').text() / 1000;
$('#plates span').text(tp);
$('.mbox').append('<span></span>')

Solution

  • Demo Fiddle Here

    add with for loop event .The for loop will append the span depend on span value. Initially remove inner content of .mbox .Then its will re added with a help of for loop

    function traceEvent(e) {
            var tp = $('.rs-tooltip').text() / 1000;
            console.log(tp);
          $('#plates span').text(tp);
          $('.mbox').html("");//empty
        for(var i=0; i<tp; i++){
            $('.mbox').append('<span id="'+[i]+'"></span>')//add
            }