Skip to main content

Show and hide target element on click button using javascript/jquery

You can show and hide the target element on the click button using javascript/jquery.

  • Show and hide target element in jQuery

    <button type="button" onclick="toggleElement('targetDiv'); return false;">  Toggle Button </button>
    <div id="targetDiv"> Html element to toggle </div>
    
    <script>
    function toggleElement(element){
        $('#'+element).toggle();
    }
    </script>
    

    You have to call the onclick method on the button using the target element id. This function can be used for multiple buttons with their target elements. JQuery provides a toggle method to hide and show the target element which is to show the element if it is hidden and hide the element if it is already shown in your HTML.

  • Back to code snippet queries related jquery