How to create elements of form using jquery

79 Views Asked by user3883296 At 10 April 2025 at 20:31

My code is

    <!DOCTYPE html>
    <html>
    <head>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">                  </script>
    <script>
    function afterText() {
        var txt3 = document.createElement("b");   
        txt3.innerHTML = $("<input/>", {
        type: 'text',
        id: 'vname',
        name: 'name',
        placeholder: 'Your Name'
     });
     $("img").after(txt3);      
    }
    </script>
     </head>
  <body>
    <img src="/images/home.gif" alt="home" width="100" height="140">
    <button onclick="afterText()">click</button>
  </body>
  </html>

The output I got is [object Object]. But how can I add the input field(Append should not be used).

Original Q&A

There are 1 best solutions below

VisioN On 02 September 2014 at 11:04 BEST ANSWER

There is no need to mix jQuery and pure JavaScript approaches for DOM manipulation.

Just use the following:

 $('<div>' +
     '<input type="text" id="vname" name="name" placeholder="Your Name">' +
   '</div>').insertAfter('img');

Or if you need it more advanced:

 $('<div>').append($('<input>', {
    type: 'text',
    id: 'vname',
    name: 'name',
    placeholder: 'Your Name'
 })).insertAfter('img');

How to create elements of form using jquery

There are 1 best solutions below

Related Questions in JAVASCRIPT

Related Questions in JQUERY

Related Questions in DOM

Related Questions in CREATEELEMENT

Related Questions in JQUERY-ATTRIBUTES

Trending Questions

Popular # Hahtags

Popular Questions