jquery function first run after two click

Question

when I load page selText() run only after two click and then it works fine but if refresh page i need to click twice again

<a href="javascript: selText();" class="select">click</a>
<input type="text"  value="value" />

<a href="javascript: selText();" class="select">click</a>
<input type='text'  value='value' />

<a href="javascript: selText();" class="select">click</a>
<input type="text"  value="value" />




function selText() {
        $(".select").click(function () { $(this).nextUntil("a").select(); });
    }

Answer 1

This is because when you add

function selText() {
    $(".select").click(function () { $(this).nextUntil("a").select(); });
}

and then click on the anchor link, what happens, the first time, is the function binds a click event to the ".select" element. This is the reason why the first click doesn't do anything. But the clicks after that will work as expected. The unwanted effect of the above code is, that you are binding the click event the multiple functions which actually do the same thing (no. of functions bound being equal to the no. of times you click the anchor tag)

The answer is, that you need to place

$(".select").click(function () { $(this).nextUntil("a").select(); });

under

$(document).ready(function(){
..// your code here
});