Question

I have a textarea in a DIV that I can not modify.

I need to add an element, an input checkbox, just after the text area with javascript.

This is the code :

<div id="msgrapidosinick"><p class="msguser">My Wall</p>
   <form method="post" id="messaggioajaxd" name="frm2">
   <textarea class="areamsgnoava" name="messaggio"></textarea>
   <input type="hidden" value="1" name="invia" id="invia">
   <input type="hidden" value="1" name="riceve" id="riceve">
   <input type="hidden" value="/assyrian" name="pagina" id="pagina">
   <input type="submit" value="Share" class="submsg" name="senda2" style="display: none;">
   </form>
   </div>

So just after the textarea I need to add an element, that is a input checkbox, when the textarea is clicked.

How do I do that?

Please help me.

Just to let you know my site loads also jQuery 1.3.2

Thank you

Answer 1

You can use the aptly-named after() method:

$("textarea[name=messaggio]").click(function() {
    $(this).after("<input type='checkbox' name='yourCheckBoxName' />");
});

If you want to avoid creating the check box if it already exists, you can do something like:

$("textarea[name=messaggio]").click(function() {
    var $this = $(this);
    if (!$this.next(":checkbox").length) {
        $this.after("<input type='checkbox' name='yourCheckBoxName' />");
    }
});