Question

I need to null the value in text box on click, currently I have written a code as such:

<div class="keyword_non">
                    <h1>Keywords : <a class="someClass question_off" title="Keywords "></a></h1>
                    <h2><input type="text" name="kw1" value="one" /></h2>
                    <h2><input type="text" name="kw2" value="two" /></h2>
                    <h2><input type="text" name="kw3" value="three" /></h2>
                    <h2><input type="text" name="kw4" value="four" /></h2>
                      
                </div>
<script type="text/javascript" src="/functions/javascript/custom/non_profit_edit.js"></script>
<script type="text/javascript" src="/functions/javascript/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/functions/javascript/custom/jquery-ui-1.8.7.custom.min.js"></script>

Inside non_profit_edit.js i have written as such

$(document).ready(function(){
                           
        $(".kw1").click(function() { 
        $(".kw1").val(" ");          
        });
        
        $(".kw2").click(function() { 
        $(".kw2").val(" ");          
        });
        
        $(".kw3").click(function() { 
        $(".kw3").val(" ");          
        });
        
        $(".kw4").click(function() { 
        $(".kw4").val(" ");          
        });
        
});

But write now its not working properly. Is this any browser issues or error in code?

Answer 1

In the selector the ‘.’ indicates a class. For names use

$('[name="kw1"]'). //