0

I've got this html with buttons for a mobile form:

 <div id="npsvalue" style="margin-bottom: -24px;">
 <input id="Q1689" name="Q1689" class="tsc_buttons2 black npsoption" type="button" value="0">
 <span class="mincircle" style="background-color: #EA0F0F;"></span>
 </div>

 <div id="npsvalue" style="margin-bottom: -24px;">
 <input id="Q1689" name="Q1689" class="tsc_buttons2 black npsoption" type="button" value="1">
 <span class="mincircle" style="background-color: #EA0F0F;"></span>
 </div>
 .
 .
 .
 <div id="npsvalue" style="margin-bottom: -24px;">
 <input id="Q1689" name="Q1689" class="tsc_buttons2 npsoption lightgrey active" type="button" value="6">
 <span class="mincircle" style="background-color: #DEDC21;"></span>
 </div>

As you can see the only difference between the first and second element and the third (sixth) one is the class. What I need to do is get the value (6 in this case) of the active class. How can I do this with jquery or javascript?

Thanks

Javier Eslava
  • 5
  • 5

2 Answers2

1

With JQuery: $(".tsc_buttons2.active")[0].value

As mentioned below, to get elements that have all the classes you want, don't put spaces between the classes.

How can I select an element with multiple classes?

Community
  • 1
  • 1
Josiah Krutz
  • 957
  • 6
  • 16
0

You can select by class in JQuery using

$(".class")

Also you should notice that the first two of the inputs have the same classes so what you're asking wouldn't work. You would want to use an ID to select the specific elements. Unfortunately, those are listed as the same in your code. You should definitely not be using the same id's for multiple elements. It's bad practice and it can cause issues when the code is run. Plus, it makes it impossible to grab a specific element by it's ID.

What you have: 

 <input id="Q1689" name="Q1689" class="tsc_buttons2 black npsoption" type="button" value="0">
<span class="mincircle" style="background-color: #EA0F0F;"></span>
</div>

<div id="npsvalue" style="margin-bottom: -24px;">
<input id="Q1689" name="Q1689" class="tsc_buttons2 black npsoption" type="button" value="1">
<span class="mincircle" style="background-color: #EA0F0F;"></span>
</div>

What you should have:

 <input id="Q1689" name="Q1689" class="tsc_buttons2 black npsoption" type="button" value="0">
<span class="mincircle" style="background-color: #EA0F0F;"></span>
</div>

<div id="npsvalue" style="margin-bottom: -24px;">
<input id="Q1690" name="Q1689" class="tsc_buttons2 black npsoption" type="button" value="1">
<span class="mincircle" style="background-color: #EA0F0F;"></span>
</div>

The way to select an element by ID with JQuery is $("#id")

So you can select the first input with $("#Q6189") or the second with $("#Q6190)

zfrisch
  • 8,474
  • 1
  • 22
  • 34