Question

I am trying to load a new page (a new div actually using jQuery mobile) depending on what radio button is selected.

<div id="main_menu">
    <div data-role="fieldcontain">
        <fieldset data-role="controlgroup">
            <div class="radioOne">
                <input type="radio" name="entry" id="radio-choice-1" value="addEmail" checked="checked" />
                <label for="radio-choice-1" class="boldWhite">Add Email Address</label>
            </div>
            <div id="entry_active_contests">
                Active Contest(s)
            </div>
            <input type="radio" name="entry" id="radio-choice-2" value="contest1"  />
            <label for="radio-choice-2" class="boldWhite">Contest</label>
        </fieldset>
    </div>
</div>

The script is like

$('.choose').click(function(){
    if ($("input[@name='entry']:checked").val() == 'addEmail'){
        window.location.hash ="first";
        alert ('1');
    }
    else if  ($("input[@name='entry']:checked").val() == 'contest1') {
        window.location.hash ="contest";
        alert ('2');
    }   else {
        alert ('3');
    }
});

All I ever get is alert 3. It is extra weird because I made a fiddle and it works fine.
http://jsfiddle.net/zkQHP/1/

Any ideas of why this wouldnt work for my actual site?

Answer 1

This works fine in JSFiddle http://jsfiddle.net/kasdega/QMw9P/ I agree with epascarello’s comment I’d alter the code to read:

$('.choose').click(function() {
    var valToCompare = $("input[name='entry']:checked").val();

    if (valToCompare == 'addEmail') {
        window.location.hash = "first";
        alert('1');
    } else if (valToCompare == 'contest1') {
        window.location.hash = "contest";
        alert('2');
    } else {
        alert('3');
    }
});