¿Cómo insertar un elemento DOM después de todos los párrafos usando jQuery?

En este artículo, insertaremos un elemento DOM después de todos los elementos de párrafo usando jQuery. Para insertar un elemento DOM usamos los métodos after() y createTextNode(). El método createTextNode() se usa para crear un TextNode que contiene un Node de elemento y un Node de texto. Se utiliza para proporcionar texto a un elemento. El método after() se utiliza para insertar el contenido especificado después de cada elemento seleccionado.

Sintaxis:

$( selector ).after( content );

Ejemplo:

HTML

<!DOCTYPE html>
<html>
  
<head>
    <!-- Import jQuery from CDN library -->
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    </script>
      
    <script>
        $(document).ready(function () {
            $("button").click(function () {
                $("p").after(document
                    .createTextNode("Hello World!"));
            });
        });
    </script>
</head>
  
<body style="text-align: center;">
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>
    <h3>
        How to insert a DOM element after
        all paragraphs using jQuery?
    </h3>
  
    <p>
        GeeksforGeeks computer
        science portal
    </p>
  
    <button>Click Here!</button>
</body>
  
</html>

Producción:

Antes de hacer clic en el botón:

Después de hacer clic en el botón:

Publicación traducida automáticamente

Artículo escrito por vkash8574 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *