javascript - jQuery hide and show text input -

javascript - jQuery hide and show text input -

i want simple function in jquery: when button clicked show input text, when it's clicked again- hide input text.

<div> <div id="btnnewgroup">new group</div> <input type="text" id="newgroup" style="display:none" /> </div>

and scrupt section:

$(document).ready(function () { $("#btnnewgroup").click(function () { if ($("#newgroup").hide()) { $("#newgroup").show(); } else { $("#newgroup").hide() } }); });

when click button text input showing, when click 1 time again want input text hidden, nil happens.

you can utilize toggle() show / hide

live demo

$("#btnnewgroup").click(function () { $("#newgroup").toggle(); });

the problem status have hiding element instead of checking if hidden. can is :hidden is(':hidden') check if element hidden.

if ($("#newgroup").is(':hidden')) { $("#newgroup").show(); else $("#newgroup").hide();

javascript jquery