1

Cómo puedo obtener una segunda clase de una etiqueta mediante un click

Esta es la etiqueta con dos clases necesito obtener la segunda

<span class="naranja manzana">Click</span>

intenté con attr de esta forma

$(".naranja").click(function(){

   var 2daClase = $(this).attr("class",2);

    alert(2daClase )


})

resultado [object Object]

resultado esperado "manzana"

2 respuestas 2

2

Puede utilizar la propiedad classList que retorna la lista de clases, para obtener la segunda clase, se accede a la posición 1, ya que los array inician en la posición 0

$(".naranja").click(function(){
  var segunda = $(this).prop('classList')[1];
  console.log(segunda );
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<span class="naranja manzana">Click</span>
<span class="naranja zandia">Click</span>

1
  • 1
    Gracias! esta genial
    – andy gibbs
    Commented el 15 feb. 2019 a las 20:41
1

Lo haria de esta forma obteniedo todas las clases y luego meterlas en un array

$(".naranja").click(function(){
   var classes = $(this).attr("class");
   var clases = classes.split(/(\s+)/);
   // clases = ["naranja"," ", "manzana"]
   if( !(typeof clases[2] === 'undefined') ) {
     console.log(clases[2]);
   }
   
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="naranja manzana">Click</span>

2
  • Cuidado con el split, fallará si en lugar de espacios hay un tab de separación entra las clases. 3;)
    – Dev. Joel
    Commented el 15 feb. 2019 a las 20:33
  • cierto, y tambien si solo hay una clase en el elemento.
    – Rene Limon
    Commented el 15 feb. 2019 a las 20:40

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.