JQuery extract form input name and add it as a class to the input

Question

I have a number of inputs in some forms and I would like to add unique classes to each input based on the input name.

So for example this:

<input name="first_name">

... would become this using JQuery:

<input name="first_name" class="first-name">

I've searched around but could not find much reference to extracting the input name.

Alex Peattie · Accepted Answer · 2011-11-23 23:12:02Z

6

Try:

$("input").each(function() {
  $(this).addClass($(this).attr("name"));
});

answered Nov 23, 2011 at 23:12

Alex Peattie

27.8k5 gold badges52 silver badges52 bronze badges

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

1 Comment

Might need to add a .replace(/_/g, '-') in there to translate the underscores to dashes, as in his example. Otherwise looks good.