insertAfter method in jQuery with example

Home » JQuery » jQuery Methods » insertAfter method in jQuery with example

insertAfter method in jQuery with example

Posted by 20Fingers2Brains on Tags: JQuery , jQuery Methods

1. insertAfter() method inserts every element in the set of matched elements after the target.

Example 1 :

        <html>
        <head>
        <title>insertAfter</title>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> 
        </script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#myButton").click(function () {
                    $("<span>This is span element.</span><br/>").insertAfter($('#targetP'));
                });
            });
        </script>
        </head>
        <body>
        <p id="targetP">This is p element. On clicking the button span will be added after the p element.</p>
        <input type="button" id="myButton" value="Click ME"/>
        <input type="button" value="Reset" onclick=""location.reload()"/>
        </body>
        </html>

Demo :

In above example, we are using insertAfter() method to insert span element after the target element specified as selector to insertAfter() method.