$('#button').click(function() {
alert($('.column').val());
});
How could I get the first, second, or third element in .column?
4 Answers
$('#button').click(function() {
alert($('.column').eq(0).val()); // first element
alert($('.column').eq(1).val()); // second
alert($('.column').eq(2).val()); // third
});
answered May 13, 2012 at 2:59
Elliot Bonneville
53.6k24 gold badges101 silver badges125 bronze badges
1 Comment
Jeppe
Just as documentation: "Reduce the set of matched elements to the one at the specified index." jQuery.eq()
I like selector strings, so I usually do this:
$('.column:eq(3)') // Fourth .column element
1 Comment
Jeff
I like them purely for style but it should be noted that the jQuery docs recommend .eq() over :eq() for performance on modern browsers: api.jquery.com/eq-selector
Use the Slice() function: http://api.jquery.com/slice/
See question: How to select a range of elements in jQuery
$('.column').slice(0, 2).each(function() {
$(this).val(); /* my value */
});
2 Comments
Norse
Slice could do it, but that function is really ideal for selecting a range if indices. Surely there is a function optimal for selecting a single index?
Jeff
you mean like nth-child or eq()? You said you wanted the first 3, maybe I misunderstood but that seems to be the definition of a range of indices?
You could use the :lt (less-than) selector and tell it you want 0, 1, and 2 by indicating all .column elements below index 3:
$("#button").on("click", function(){
$(".column:lt(3)").each(function(){
alert( this.value );
});
});
.column, or three elements within a parent.columnelement?