Quiero obtener el nombre de la clase usando jQuery

Y si tiene una identificación

<div class="myclass"></div>

Después de obtener el elemento como objeto jQuery por otros medios que no sean su clase, entonces

var className = $('#sidebar div:eq(14)').attr('class');

debería hacer el truco. Para el uso de identificación .attr('id').

Si está dentro de un controlador de eventos u otro método jQuery, donde el elemento es el nodo DOM puro sin envoltorio, puede usar:

this.className // for classes, and
this.id // for IDs

Ambos son métodos DOM estándar y están bien soportados en todos los navegadores.

Es mejor usarlo .hasClass()cuando desea verificar si un elemento tiene un particular class. Esto se debe a que cuando un elemento tiene múltiples classno es trivial verificarlo.

Ejemplo:

<div id='test' class='main divhover'></div>

Dónde:

$('#test').attr('class');        // returns `main divhover`.

Con .hasClass()podemos probar si divtiene la clase divhover.

$('#test').hasClass('divhover'); // returns true
$('#test').hasClass('main');     // returns true

Tenga cuidado, tal vez, tiene una clase y una subclase.

  <div id='id' class='myclass mysubclass' >dfdfdfsdfds</div>

Si usa soluciones anteriores, tendrá:

myclass mysubclass

Entonces, si desea tener el selector de clase , haga lo siguiente:

var className = '.'+$('#id').attr('class').split(' ').join('.')

y tendrás

.myclass.mysubclass

Ahora, si desea seleccionar todos los elementos que tienen la misma clase, como div arriba:

   var brothers=$('.'+$('#id').attr('class').split(' ').join('.'))

eso significa

var brothers=$('.myclass.mysubclass')

Actualización 2018

O puede implementarse con JavaScript de vainilla en 2 líneas:

  const { classList } = document.querySelector('#id');
  document.querySelectorAll(`.${Array.from(classList).join('.')}`);

Esto es para obtener la segunda clase en múltiples clases usando un elemento

var class_name = $('#videobuttonChange').attr('class').split(' ')[1];

simplemente puedes usar,

var className = $('#id').attr('class');

Si <div>tiene un id:

​<div id="test" class="my-custom-class"></div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

...puedes probar:

var yourClass = $("#test").prop("class");

Si <div>solo tiene un class, puede probar:

var yourClass = $(".my-custom-class").prop("class");

Si va a utilizar la función de división para extraer los nombres de las clases, deberá compensar las posibles variaciones de formato que podrían producir resultados inesperados. Por ejemplo:

" myclass1  myclass2 ".split(' ').join(".")

produce

".myclass1..myclass2."

Creo que es mejor usar una expresión regular para que coincida en el conjunto de caracteres permitidos para los nombres de clase. Por ejemplo:

" myclass1  myclass2  ".match(/[\d\w-_]+/g);

produce

["myclass1", "myclass2"]

La expresión regular probablemente no esté completa, pero espero que entiendas mi punto. Este enfoque mitiga la posibilidad de un formato deficiente.

Para completar la respuesta de Whitestock (que es lo mejor que encontré) hice:

className = $(this).attr('class').match(/[\d\w-_]+/g);
className = '.' + className.join(' .');

Entonces, para "myclass1 myclass2" el resultado será '.myclass1 .myclass2'

Puede obtener el nombre de la clase de dos maneras:

var className = $('.myclass').attr('class');

O

var className = $('.myclass').prop('class');

<div id="elem" class="className"></div>

Con Javascript

document.getElementById('elem').className;

Con jQuery

$('#elem').attr('class');

O

$('#elem').get(0).className;

Si no conoce el nombre de la clase PERO conoce la ID, puede intentar esto:

<div id="currentST" class="myclass"></div>

Luego llámalo usando:

alert($('#currentST').attr('class'));

Si desea obtener clases de div y luego desea verificar si existe alguna clase, entonces simplemente use.

if ( $('#div-id' ).hasClass( 'classname' ) ) {
    // do something...
}

p.ej;

if ( $('body').hasClass( 'home' ) ) {
    $('#menu-item-4').addClass('active');
}

Intentalo

HTML

<div class="class_area-1">
    area 1
</div>

<div class="class_area-2">
    area 2
</div>

<div class="class_area-3">
    area 3
</div>

jQuery

<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script type="application/javascript">
    $('div').click(function(){
        alert($(this).attr('class'));
    });
</script>

si tenemos solo o queremos el primer divelemento podemos usar

$('div')[0].classNamede lo contrario necesitamos uno idde ese elemento

Si tenemos un código:

<div id="myDiv" class="myClass myClass2"></div> 

para tomar el nombre de la clase usando jQuery podríamos definir y usar un método de complemento simple:

$.fn.class = function(){
  return Array.prototype.slice.call( $(this)[0].classList );
}

o

 $.fn.class = function(){
   return $(this).prop('class');
 } 

El uso del método será:

$('#myDiv').class();

Tenemos que notar que devolverá una lista de clases a diferencia del método nativo element.className que devuelve solo la primera clase de las clases adjuntas. Debido a que a menudo el elemento tiene más de una clase adjunta, le recomiendo que no use este método nativo sino element.classlist o el método descrito anteriormente.

La primera variante devolverá una lista de clases como una matriz, la segunda como una cadena - nombres de clase separados por espacios:

// [myClass, myClass2]
// "myClass myClass2"

Otro aviso importante es que tanto los métodos como el método jQuery

$('div').prop('class');

solo se devuelve la lista de clases del primer elemento capturado por el objeto jQuery si utilizamos un selector más común que señala muchos otros elementos. En tal caso, tenemos que marcar el elemento, queremos obtener sus clases, usando algún índice, por ejemplo

$('div:eq(2)').prop('class');

Depende también de lo que necesite hacer con estas clases. Si solo desea verificar una clase en la lista de clases del elemento con esta identificación, debe usar el método "hasClass":

if($('#myDiv').hasClass('myClass')){
   // do something
}

como se menciona en los comentarios anteriores. Pero si necesita tomar todas las clases como selector, use este código:

$.fn.classes = function(){
   var o = $(this);
   return o.prop('class')? [''].concat( o.prop('class').split(' ') ).join('.') : '';
 } 

 var mySelector = $('#myDiv').classes();

El resultado será:

// .myClass.myClass2

y podría hacer que cree dinámicamente una regla css de reescritura específica, por ejemplo.

Saludos

Esto tambien funciona.

const $el = $(".myclass");
const className = $el[0].className;

La mejor manera de obtener el nombre de la clase en javascript o jquery

attr() La función de atributo se utiliza para obtener y establecer el atributo.

Obtener clase

jQuery('your selector').attr('class');  // Return class

Comprobar clase existe o no

The hasClass() method checks if any of the selected elements have a specified class name.

 if(jQuery('selector').hasClass('abc-class')){
        // Yes Exist
    }else{
        // NOt exists
    }

Establecer clase

jQuery('your selector').attr('class','myclass');  // It will add class to your selector

Obtenga clase al hacer clic en el botón usando jQuery

jQuery(document).on('click','button',function(){
     var myclass = jQuery('#selector').attr('class');
});

Agregue clase si el selector no tiene ninguna clase usando jQuery

if ( $('#div-id' ).hasClass( 'classname' ) ) {
        // Add your code
    }

Obtenga la segunda clase en varias clases usando un elemento

Change array position in place of [1] to get particular class.

var mysecondclass = $('#mydiv').attr('class').split(' ')[1];

usar así: -

$(".myclass").css("color","red");

si ha usado esta clase más de una vez, use cada operador

$(".myclass").each(function (index, value) {
//do you code
}