Insert text after “this” input-element with javascript?

Question

Code:

<input type="text" onkeydown="
  if (event.keyCode == 13) { HERE, ECHO "OK" RIGHT AFTER THIS INPUT ELEMENT }
">

Is this possible to do without putting an ID or name on this element? Or without encasing it in an identifiable div?

To clarify, this should be the result html after the event keycode is pressed:

<input type="text" onkeydown="
  if (event.keyCode == 13) { HERE, ECHO "OK" RIGHT AFTER THIS INPUT ELEMENT }
">OK

Answer 1

If you want to use jQuery you can do the following:

HTML

<input name="ok" type="text" id="showOK" />

JAVASCRIPT

$("#showOK").keypress(function() {
  if (event.keyCode == 13){
     $("<p>OK</p>").insertAfter("#showOK");
  }
});

Without the Use of ID

<input type="text" onkeydown="if (event.keyCode == 13) { $('<p>OK</p>').insertAfter(this);}">

Answer 2

Following your requirements and trying to keep your style, you can use the insertAdjacentHTML DOM Element method to add a text just after the input element.

<input type="text" onkeydown="
  if (event.keyCode == 13) { this.insertAdjacentHTML('afterend', 'OK');}
">

See demo

Answer 3

I used a mixture of answers here. First off i had to create a new var:

var that = this;

Or else javascript could not find "this" somehow.

Then used the jQUery method:

$('<span>OK</span>').insertAfter(that);

Resulting in:

<input type="text" onkeydown="
  if (event.keyCode == 13) { var that = this; $('<span>OK</span>').insertAfter(that); }
">

Answer 4

Ok, first off, don't use inline-js. But to answer your question,

<input type="text" onkeydown="
    if (window.event.keyCode == 13) { this.outerHTML = this.outerHTML + 'Ok'; } "/>

DEMO

Answer 5

<input type="text" onkeydown="ok(this, event)"/>

function ok(el, event) {
    var _ok = document.createElement('span');

    _ok.textContent = 'ok';

    if (event.which == 13) {
        el.parentNode.insertBefore(_ok, el.nextSibling)
    }
}

Answer 6

Try this:

<input type="text" onkeydown="(function(event){
    var input = event.target;
    if(event.keyCode == 13){
      input.outerHTML += 'OK';
    }
  })(window.event);" />

Demo .

Answer 7

Try this:

<input type="text" onkeydown="
if (event.keyCode == 13) { this.parentNode.insertBefore(document.createTextNode('OK'), this.nextElementSibling); }
">

It will add a text node (without creating any span or div) directly after the input.