Define global variable in JQuery

Simply declare the variable on the global scope.

var PClevel = '';
$(document).ready(function() {
    $('#confirmLevel').click(function() {
        PClevel = $("#selectLevel option:selected").text();
        $('#t1').append('Level ' + PClevel); 
    });
});

It would be worth reading up on javascript scopes as they are relevant whether you are using jQuery or not.

http://www.sitepoint.com/demystifying-javascript-variable-scope-hoisting/


The problem is that PClevel is scoped inside the click handler. It cannot be accessed outside. In order for code outside to see PClevel, declare it outside and have the click handler just modify it.

$(document).ready(function() {
    var PClevel; // Code inside the ready handler can see it.

    $('#confirmLevel').click(function() {
        PClevel = $("#selectLevel option:selected").text();
        $('#t1').append('Level ' + PClevel); 
    });
});

// or

var PClevel; // Now it's a global. Everyone can see it.
$(document).ready(function() {
    $('#confirmLevel').click(function() {
        PClevel = $("#selectLevel option:selected").text();
        $('#t1').append('Level ' + PClevel); 
    });
});