encontrar la primera aparición de la clase en div

Question

tengo la estructura HTML, quiero encontrar el código HTML interno de la primera div con la clase como "popcontent" usando jQuery

<div> 
<div class="popContent">1</div> 
<div class="popContent">2</div> 
</div> 

Answer 1

Va a patear mismos ..... :)

$(".popContent:first").html() 

Answer 2

puede utilizar :first selectora en este caso

$('.popContent:first').text(); 

DEMO

Answer 3

$("div.popContent:first").html() 

debe darle el primer d iv de contenido ("1" en este caso)

Answer 4

Utilice el Jquery :first selector, como a continuación:

$(".popContent:first"); 

Answer 5

Usted puede usar la siguiente jQuery expresión

alert(jQuery('div.popContent').eq(0).html()); 

Answer 6

primera aparición de clase en la div

$('.popContent').eq(0).html('value to set'); 

Segunda ocurrencia de clase en la div

$('.popContent').eq(1).html('value to set'); 

Answer 7

$("div.popContent:first").html(); 

Answer 8

Usted podría utilizar document.querySelector()

Devuelve el primer elemento dentro del documento (usando primero en profundidad pre ordenar el recorrido de los nodos del documento | por el primer elemento en marcado de documentos e iteración a través de nodos secuenciales por orden de cantidad de nodos secundarios) que coincida con el grupo especificado de selectores.

Ya que sólo está buscando primera aparición, tiene mejor rendimiento que jQuery

var count = 1000; 
 
var element = $("<span>").addClass("testCase").text("Test"); 
 
var container = $(".container"); 
 
var test = null; 
 
for(var i = 0; i < count; i++) { 
 
\t container.append(element.clone(true)); 
 
} 
 

 
console.time('get(0)'); 
 
test = $(".testCase").eq(0); 
 
console.timeEnd('get(0)'); 
 
console.log(test.length); 
 

 
console.time('.testCase:first'); 
 
test = $(".testCase:first"); 
 
console.timeEnd('.testCase:first'); 
 
console.log(test.length); 
 

 
console.time('querySelector'); 
 
test = document.querySelector(".testCase"); 
 
console.timeEnd('querySelector'); 
 
console.log(test);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="container"></div>

jsFiddle version of snippet