find first occurrence of class in div

Answer 1

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

Answer 2

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

should give you the first div's content ("1" in this case)

Answer 3

You will kick yourself..... :)

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

Answer 4

You can use the following jQuery expression

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

Answer 5

You could use document.querySelector()

Returns the first element within the document (using depth-first pre-order traversal of the document's nodes|by first element in document markup and iterating through sequential nodes by order of amount of child nodes) that matches the specified group of selectors.

Since it is only looking for first occurence, it has better performance than jQuery

var count = 1000;
var element = $("<span>").addClass("testCase").text("Test");
var container = $(".container");
var test = null;
for(var i = 0; i < count; i++) {
	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

Answer 6

first occurrence of class in div

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

Second occurrence of class in div

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