jquery and click function

Question

$(document).ready(function(){ $("#changeText").click(function() { $("#textBox").html("text text"); }); });

How make that if i push on #changeText twice or more, i get two (or more) text text

I'm bothered by the "#textBox". Is it a textbox? If it is then you can't use html() or append() on that... — Reigel Gallarde
– Reigel Gallarde, Commented Aug 9, 2010 at 9:09

jAndy · Accepted Answer · 2010-08-09 08:49:25Z

4

don't use .html() which overwrites the entire innerHTML structure.

To append new html markup use .append() or .appendTo()

$(document).ready(function(){
  $("#changeText").click(function() {
      $("#textBox").append("<div>text text</div>");
  });
});

or in a more jQuery'ish chaining way:

$('<div>text text</div>').appendTo($('#textBox')); // .css().fadeOut().animate().etc()

Ref.: .append(), .appendTo()

answered Aug 9, 2010 at 8:49

jAndy

237k57 gold badges313 silver badges363 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

lolalola Over a year ago

Thank you very much, But why new <div> put no't in #textBox start. Always when i make second (or more) make space before new div?

jAndy Over a year ago

@lolalola: I'm afraid I don't understand. Please try to clarify

lolalola Over a year ago

Very sorry for my English language. When insert new "<div>text text</div>" befor this tag emerge space the same size as the previous been div. (I insert all div in one row with float: left).

Artem Barger · Accepted Answer · 2010-08-09 12:15:29Z

0

You need to create div inside #textBox and then

$("#changeText").click(function() {
    $("#textBox div").append("text");
});

EDIT:

$("#changeText").click(function() {
    if ( $("#textBox div").length()>0)
          $("#textBox div").append("text");
    else
         $("#textBox").append("<div>text</div>");
});

edited Aug 9, 2010 at 12:15

answered Aug 9, 2010 at 8:50

Artem Barger

41.3k9 gold badges61 silver badges81 bronze badges

2 Comments

jAndy Over a year ago

why bring another div into play?

Artem Barger Over a year ago

and why insert each time new one? he was interested inserting each time new "text", but not the "text" inside new div. anyway could be easily changed and extend to whatever you like. As a main direction solution correct.

Collectives™ on Stack Overflow

jquery and click function

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related