How to use jQuery Mobile selector menus?

Question

I've finally found the HTML for the jQuery Mobile selector menu component, thanks to my other question, but I'm stuck again.

I'm currently using this code, which works nicely:

<div data-role="content">   
    <div data-role="fieldcontain"> 
        <label for="select-choice-nc" class="select">Font Choice:</label> 
        <select name="select-choice-4" id="select-choice-nc"> 

            <option value="arial">Arial</option> 
            <option value="papyrus">Papyrus</option> 
            <option value="helvetica">Helvetica</option> 
            <option value="calibri">Calibri</option> 

        </select> 
    </div> 
</div><!-- /content -->

But how do I tell which option has been selected?

Answer 1

It's just like jQuery sans Mobile (perhaps jQuery Immobile?). As with other form elements, use .val() to get the value of the <select>:

$('#select-choice-nc').val();