CODEWITHSUNDEEP
jqueryjquery-ui
ttback
ttback

Reputation: 2111

How to flash color change for text inside a div element with jQuery UI?

I need to flash the color change of gender and comment(flash them red and turn back to original again)

  var dataDIV = $("<div id="+dataDivId+" class=\"data\"></div>");
  $("#data").append(dataDIV);
  var divData= $(
   "<h3 class=\"name\">"+person.name+"</h3>"+
   "<h2 class=\"gender\">"+person.gender+"</h2>"+
   "<p class=\"comment\">("+person.comment+")</p>"
   );   
  $("#"+dataDivId).html(divData);

I tried to do it with:

 $(divData).effect("highlight", {color:"#FF0000"}, 1500);

But it would apply flash effect on the entire divData, not the h2 and p elements. Is there any way I can do it just for gender and comment?

I also don't want this to happen to other div units that have this divData element in it(not flashing other person objects, just the one being changed)

I tried to pull out ""+person.gender+"" as a separate variable and apply effect to it, that didn't work either.

Upvotes: 1

Views: 929

Answers (1)

Selvakumar Arumugam
Selvakumar Arumugam

Reputation: 79830

If I understood correctly, you need something like below,

$('.gender, .comment', $('#' + dataDivId)).effect("highlight", {
   color: "#FF0000"
}, 1500);

DEMO Click on Add button.

Upvotes: 2

Related Questions