Push drop Element zu Array mit jQuery UI?

Question

Ich versuche, die ID eines Wortes in eine Liste zu pushen, sobald es mit der Drop-Funktion von jQuery UI gelöscht wird. Wenn ich das Wort ziehe und ablege, gibt mir die console.log() die richtige ID. Aber mein .push() Anruf unten tut nichts. Wie schiebe ich die angegebene ID?

Ziel:

Vor Tropfen: Ein, zwei,

Nach Tropfen: Eins, Zwei, Drei,

JavaScript:

var words = ["One,Two,"]; 
document.getElementById("demo").innerHTML = words.toString(); 

$(move); 

function move() { 
    $('#moving').draggable(); 
    $('#drop').droppable({ 
    drop: handleDropEvent 
    }); 
} 

function handleDropEvent(event, ui) { 
    var draggable = ui.draggable; 
    var droppable = ui.droppable; 
    var word = ui.draggable.attr('id') 
    words.push(word) 
    console.log(word) 
    $('#moving').hide(draggable.attr); 
} 

HTML:

<p id="demo"></p> 

<div> 
    <span id="Three"> 
     <strong> Three </strong> 
    </span> 
</div> 

Answer 1

Die #demo Element wird nicht automatisch aktualisiert, wenn Sie die words Variable ändern. Sie müssen es manuell aktualisieren: