TJ Lee
TJ Lee

Reputation: 13

How do you add a Class that Increment to Elements that are appending with jquery

I have a script that appends an input form field to my form. I want it to add a class that increments by 1 each time a form field gets appended.

For example. Check out my https://jsfiddle.net/webtj01/aypkzgfx/

I want each time a user clicks the add field button, it would add with input field with the classes like this

class="Field1"

class="Field2"

class="Field3"

class="Field4"

class="Field5"

Upvotes: 0

Views: 60

Answers (1)

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67207

You already have a variable called x for detecting the max count, Just use it.

var x = 1; //initlal text box count
  $(add_button).click(function(e) { //on add input button click
    e.preventDefault();
    if (x < max_fields) { //max input box allowed
      $(wrapper).append('<div><input class="Field' + ++x + '" type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a></div>'); //add input box
    }
  });

DEMO

Upvotes: 1

Related Questions