Reputation: 303
I wanted to hide my second image with jQuery .hide()
but the method is not working in some cases.
Here's my code:
jQuery
var one = $('ul li > img')[0];
var two = $('ul li img')[1];
var three = $('ul li img')[2];
$(two).on('click', function(){
alert('working');
});
two.hide();
html
<ul>
<li><img src="http://img.pixland.uz/u13301f281573m.jpg" alt=""></li>
<li><img src="http://img.pixland.uz/u13301f281573m.jpg" alt=""></li>
<li><img src="http://img.pixland.uz/u13301f281573m.jpg" alt=""></li>
</ul>
Upvotes: 0
Views: 80
Reputation: 2047
var one = $('ul li:eq(0) img');
var two = $('ul li:eq(1) img');
var three = $('ul li:eq(2) img');
Upvotes: 0
Reputation: 5259
All you need to change in your code is two.hide() to ${two}.hide()
Upvotes: 0
Reputation: 4416
Try this:
var one = $('ul li > img')[0];
var two = $('ul li img')[1];
var three = $('ul li img')[2];
$(two).on('click', function(){
alert('working');
$(two).hide();
});
Upvotes: 1
Reputation: 1864
Object named two
is not a jQuery object, it's just a plain DOM object. You should either do:
var one = $('ul li > img')[0];
var two = $('ul li img')[1];
var three = $('ul li img')[2];
$(two).on('click', function(){
alert('working');
});
$(two).hide();
or do:
var one = $('ul li > img').eq(0);
var two = $('ul li img').eq(1);
var three = $('ul li img').eq(2);
$(two).on('click', function(){
alert('working');
});
two.hide();
Upvotes: 1
Reputation: 708056
$('ul li img')[1]
is a DOM object, not a jQuery object so it doesn't have a .hide()
method.
You can use this:
$('ul li img').eq(1)
instead, if you want a jQuery object.
The whole code block would look like this:
var one = $('ul li > img').eq(0);
var two = $('ul li img').eq(1);
var three = $('ul li img').eq(2);
two.on('click', function(){
alert('working');
});
two.hide();
Upvotes: 8