jQuery counting elements by class - what is the best way to implement this

Question

What I m trying to do is to count all of the elements in the current page with the same class and then I m going to use it to be added onto a name for an input form  Basically I m allowing users to click on a  lt span gt  and then by doing so add another one for more of the same type of items  But I can t think of a way to count all of these simply with jQuery JavaScript   I was going to then name the item as something like name  whatever total 1    if anyone has a simple way to do this I d be extremely grateful as JavaScript isn t exactly my native tongue

User · Answer

var count           myclassname  length

User · Answer

Should just be something like      Gets the number of elements with class yourClass var numItems       yourclass   length        As a side-note  it is often beneficial to check the length property before chaining a lot of functions calls on a jQuery object  to ensure that we actually have some work to perform  See below   var  items       myclass       Ensure we have at least one element in  items before setting up animations    and other resource intensive tasks  if  items length       items animate               It might also be appropriate to check that we have 2 or more        elements returned by the filter-call before animating this subset of         items       filter   odd          animate               end        promise        then function               items addClass  all-done

User · Answer

for counting       yourClass   length   should work fine   storing in a variable is as easy as   var count       yourClass   length

User · Answer

HTML   lt div gt       lt img src    class  class    gt       lt img src    class  class    gt       lt img src    class  class    gt   lt  div gt         JavaScript  var numItems       class   length            alert numItems    Fiddle demo for inside only div

User · Answer

Getting a count of the number of elements that refer to the same class is as simple as this   lt html gt       lt head gt           lt script src  http   code jquery com jquery-1 4 2 min js  gt  lt  script gt           lt script type  text javascript  gt                 document  ready function                     alert      red   length                              lt  script gt       lt  head gt       lt body gt            lt p class  red  gt Test lt  p gt           lt p class  red  gt Test lt  p gt           lt p class  red anotherclass  gt Test lt  p gt           lt p class  red  gt Test lt  p gt           lt p class  red  gt Test lt  p gt           lt p class  red anotherclass  gt Test lt  p gt       lt  body gt   lt  html gt

User · Answer

try  document getElementsByClassName  myclass   length    x000D   x000D  let num   document getElementsByClassName  myclass   length  x000D  console log  Total  myclass  elements    num   x000D   myclass   color  red   x000D   lt span class  myclass   gt 1 lt  span gt  x000D   lt span gt 2 lt  span gt  x000D   lt span class  myclass  gt 3 lt  span gt  x000D   lt span class  myclass  gt 4 lt  span gt  x000D   x000D   x000D

[javascript] jQuery counting elements by class - what is the best way to implement this?

Examples related to javascript

Examples related to jquery

Examples related to css

Examples related to element