Question

My question may sound a little confusing, but I hope after reading this it will be a little more clear.

html

<form id="form">
selected: <input type="text" name="opt" id="opt">
<ul id="list">
<li>car</li>
<li>bus</li>
<li>bike</li>
</ul>
<input type="submit" name="submit" value="submit">
</form>

JavaScript

$('#list li').click(function(){
    var id= $(this).text();
    $('#form').submit(function(){
        alert(id);
    });
});

When I click a list-item and then click another list-item before clicking submit, it alerts one after the other, for e.g. if I click car then bike, it alerts bike then it flashes and then alerts car. The aim is to only have it alert the final click, or in other words the one that is the chosen option. So instead of alerting on each click, I want it to alert bike since that was the final option.

Answer 1

Try this: Working demo http://jsfiddle.net/RFgYk/1/ or http://jsfiddle.net/RFgYk/

code

$('#list li').click(function() {
    id = $(this).text();

});

$('#form').submit(function() {
    alert(id);
});​