Finding Which Class[i] queue I Click

Question

I wanna learn which classname[i] number I am clicking.. I wanna learn what is "i" when I click.. How can I get that data?

    function findclassquee(id) {
alert ("I am confused please help me about finding which one I am?; *<<<document.getElementsByClassName('trying')[1] or  *document.getElementsByClassName('trying')[5]>>> ");

    };

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button onclick="findclassquee(this.id)" class="trying">Which Class </button>
<button onclick="findclassquee(this.id)" class="trying">Which Class </button>
<button onclick="findclassquee(this.id)" class="trying">Which Class </button>
<button onclick="findclassquee(this.id)" class="trying">Which Class </button>
<button onclick="findclassquee(this.id)" class="trying">Which Class </button>
<button onclick="findclassquee(this.id)" class="trying">Which Class </button>

score 0 · Answer 1 · answered Jun 24 '21 at 22:17

0

Youy can do it like this, with indexOf:

var elems = Array.from(document.querySelectorAll('.trying'));
// Listen for clicks on each element
elems.forEach(el => el.addEventListener('click', findclassquee));

function findclassquee() {
  // Find the index of the clicked one
  var index = elems.indexOf(this);
  alert(`You clicked on the element at index ${index}`);
}

<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>

Note: I'm using Array.from() to convert the NodeList to an Array, and be able to use Array methods on it, like indexOf.

answered Jun 24 '21 at 22:17

blex

24,941
5
39
72

isnt there a simple code like , getclassqueue(trying) ?? – May Jun 24 '21 at 22:22
No, not natively (I'm also unfamiliar with what you call a "queue", there is no "queue" concept in the DOM, but maybe you are referring to something you saw a library do?) – blex Jun 24 '21 at 22:26
your solution is what ı want no problem queue means = [i] .. I am ok with your solution .. just wonder maybe there is a shortest version do directly get the indexf – May Jun 24 '21 at 22:28
- i think this the shortest way but what I'm thinking about is that you want a more clear way you can resplace `this.id` into your html onclick attribute with just `this` then you can try the following function – JS_INF Jun 24 '21 at 23:02
```function findclassquee(el) { var trying = document.getElementsByClassName("trying"); for(var i = 0; i < trying.length; i++) { if(trying[i] === el) { console.log(i) } } }``` – JS_INF Jun 24 '21 at 23:03
this seems risky way if more than 1 datas are absulatly same – May Jun 24 '21 at 23:14
@blex please can you check that question also ? ; https://stackoverflow.com/questions/68129502/create-new-button-doesnt-call-class – May Jun 25 '21 at 12:06

score 0 · Accepted Answer · answered Jun 25 '21 at 18:01

This is the best I want , at last I found that :

$(".trying").click(function(){alert($(".trying").index(this));});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>
<button class="trying">Which Class</button>

Finding Which Class[i] queue I Click

2 Answers2