Jquery - Select empty text input and add border for them

Question

I want to add a border for empty text input fields. So I wrote a following code. But it is not working. So i used alert box for get to know how many selectors are select. But it is return 0. What is my wrong?

 $("input[type=submit]").click(function(){
       var empty = $('input:text[value=""]');
       alert(empty.length);

       if(empty.length >0){

           $("form").effect("shake",{
               times:3,
               distance : 50         

           },450,function(){
           $('input:text[value=""]').each(function(){
              $(this).css("border","1px solid red"); 
           });
           });



           return false;
       }

   });

Answer 1

Try to use .filter() for this purpose, value attribute won't get affected while you changing the value in it.

$('input:text').filter(function(){
   return $.trim(this.value).length == 0;
}).css("border","1px solid red");