user3130064
user3130064

Reputation: 1071

Form with jQuery don't working correct

I'm trying make a form. Where when you select an option, the empty value is removed and the color changes.

But, when you change the option, all empty values are being removed at the same time.

What i have to do to resolve this?

DEMO

$(document).ready(function() {
    $('.changeMe').change(function(){
      $('.empty').remove();
      $(this).css({'color':'black'});
    });
});   

Thanks in advance

Upvotes: 1

Views: 65

Answers (3)

dpetrova
dpetrova

Reputation: 81

OK, try this:

$(document).ready(function() {
        $('.changeMe').change(function(){
          var $this = $(this);
          $this.parents("div").find('.empty').remove();
          $this.removeClass("blue");
          $this.addClass("black");
        });
    }); 

Basically, you need first to find the parent div (containing the row) and remove any .empty descendants.

Upvotes: 0

Venkata Krishna
Venkata Krishna

Reputation: 15112

http://jsfiddle.net/Cjdbx/4/

$('.changeMe').change(function(){
    $('.empty',this).remove();
    $(this).css({'color':'black'});
});

You are removing all classes with empty. You have to only remove the one which is related. So, use this.

Upvotes: 1

Dan-Nolan
Dan-Nolan

Reputation: 6657

Try:

$(this).find('.empty').remove();

Demo

Upvotes: 1

Related Questions