jquery-ui nicht anwenden css

Question

Ich versuche, einen jquery-Schieberegler zu erstellen, aber jquery-ui css wird überhaupt nicht auf ein div angewendet. Jede Hilfe wird geschätzt!

var dummy = document.createElement('div') 
dummy.innerHTML = 'dummy' 

var wRange = document.createElement('div') 
wRange.setAttribute('id', 'range') 
wRange.classList.add('cntr') 

$("#range").slider({ 
    range: "min", 
    min: 0, 
    max: 999, 
    value: 50, 
    slide: function(e, ui) { 
    return $(".ui-slider-handle").html(ui.value) 
    } 
}) 

$(".ui-slider-handle").html("50") 

document.body.appendChild(dummy) 
document.body.appendChild(wRange) 

hier: fiddle

Answer 1

Sie sind Elemente

$("#range")slider({...}); 
$(".ui-slider-handle").html("50"); 

Auswahl, bevor sie an Körper angehängt, so jQuery sie nicht in einem DOM finden.

Sie, dass:

document.body.appendChild(dummy) 
document.body.appendChild(wRange) 

$("#range").slider({ 
    range: "min", 
    min: 0, 
    max: 999, 
    value: 50, 
    slide: function(e, ui) { 
    return $(".ui-slider-handle").html(ui.value) 
    } 
}) 

$(".ui-slider-handle").html("50") 

Oder jQuery Stil Art und Weise:

var dummy = $('<div>').html('dummy'); 

var wRange = $('<div>') 
    .attr('id','range') 
    .addClass('cntr') 
    .slider({ 
     range: "min", 
     min: 0, 
     max: 999, 
     value: 50, 
     slide: function(e, ui) { 
      return $(".ui-slider-handle").html(ui.value) 
     } 
    }); 

$(document.body).append(dummy, wRange);