Saving variable after event

Could someone explain me please why this didn't working: http://jsfiddle.net/4nzYr/

<ul>
    <li class="draggable">hello</li>
    <li class="draggable">how are you today</li>
</ul&g开发者_如何学运维t;

and..

  $(function(){
        $('.draggable').draggable({axis: 'y', start: function (event, ui){var dragged=true}})
            if (dragged == true){$('<p>super</p>').appendTo($('.draggable'))}
            })

I i expected append new paragraph. And for more i expected to have possibility to use variable dragged to other actions.

You are calling this code only once when the page loads. This will never be append because the code is never run again after dragging.

if (dragged == true){
    $('<p>super</p>').appendTo('li');
}

You need another event to stick this code block into. Also notice that dragged is now defined outside of draggable's start delegate. For example:

$(function() {
    var dragged = false;

    $('.draggable').draggable({
        axis: 'y',
        start: function (event, ui) {
            dragged = true;
        }
    });

    $('#checkButton').click(function() {
        if (dragged == true){
            $('<p>super</p>').appendTo('li');
        }
    });
});