hi. i just want to know if that is possible.

for example there are 5 blank textboxes with no specific id or class:

<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">

is there a way to loop through the textboxes and find the first blank textbox?

say the top already has a value inserted by user:

not blank: <input type="text">

blank:

<input type="text">
<input type="text">
<input type="text">
<input type="text">

so through the loop the result would be the blank textbox below the not blank textbox. TIA

You can use each() to loop them, and then return false when you get the first empty value, as example:

<form>
    <input type="password" name="passwd" value="" />
    <input type="text" name="aaa" value="test 1" />
    <input type="text" name="bbb" value="test 2" />
    <input type="text" name="ccc" value="" />
    <input type="text" name="ddd" value="test 4" />
    <input type="text" name="eee" value="" />
</form>

JS:

$('input:text').each(function(){
    if($(this).val().length === 0)
    {
        console.log($(this).attr('name'));
        return false;
    }
});

Documentation: http://api.jquery.com/each/

This should work:

$("input[value='']:visible:first");

The visible is just there to skip any hidden fields.

i did not explain what my goal was did i.

so what im doing is having a table listing a few names and then 5 textboxes next to it. each row when doubleclicked will append the name into a textbox.

not sure if im going about it right or if there is a better way but with pritaeas code i did:

Name 1 : <input type="text" class="textbox" id="name1" value=""><br> 
Name 2 : <input type="text" class="textbox" id="name2" value=""><br>
Name 3 : <input type="text" class="textbox" id="name3" value=""><br>
Name 4 : <input type="text" class="textbox" id="name4" value=""><br>
Name 5 : <input type="text" class="textbox" id="name5" value=""><br><br>



$(".textbox").each(function(){
   var textbox = $("input[value='']:visible:first");
   textbox.val(name);
});

and it does fill up the first textbox when a name is doubleclicked but then on the second time the first textbox just get replaced with the second name.

So, for example:

<table id="names">
    <tr>
        <td data-name="oranges">
            oranges
        </td>
        <td data-name="apples">
            apples
        </td>
        <td data-name="coconut">
            coconut
        </td>
        <td data-name="strawberries">
            strawberries
        </td>
    </tr>
</table>

<form>
    <input type="text" name="aaa" value="" />
    <input type="text" name="bbb" value="" />
    <input type="text" name="ccc" value="" />
    <input type="text" name="ddd" value="" />
    <input type="text" name="eee" value="" />
</form>

Then you can do:

$("#names td").click(function(){
    var name = $(this).data('name');

    $('input:text:visible').each(function(){
        if($(this).val().length === 0)
        {
            $(this).val(name);
            return false;
        }
    });
});

JSfiddle: http://jsfiddle.net/hmwv1hx7/