📘 30 Most Useful jQuery Snippets

if ($('#myElement').length) { console.log('Element exists!'); } 

$('.items').each(function(index, element) { console.log(index, $(element).text()); }); 

$('#btn').click(function() { $('#box').toggleClass('active'); }); 

$('html, body').animate({ scrollTop: $('#target').offset().top }, 500); 

$(document).mouseup(function(e) { if (!$('#popup').is(e.target) && $('#popup').has(e.target).length === 0) { $('#popup').hide(); } }); 

const value = $('#item').data('value'); 

$('#input').keypress(function(e) { if (e.which === 13) { alert('Enter pressed!'); } }); 

$('#message').text('New message!'); 

if ($.trim($('#name').val()) === '') { alert('Name is required!'); } 

let timeout; $('#search').on('input', function() { clearTimeout(timeout); timeout = setTimeout(() => { console.log('Search:', this.value); }, 300); }); 

$('#list').append('<li>New Item</li>'); 

$('#content').empty(); 

$('.ad-banner').remove(); 

$('#box').css({ backgroundColor: 'blue', fontSize: '18px' }); 

const height = $('#header').outerHeight(); 

$('form').submit(function(e) { e.preventDefault(); alert('Form prevented!'); }); 

$('#modal').fadeIn(300); 

$('#overlay').fadeOut(300); 

$('#toggle-btn').click(function() { $('#panel').slideToggle(); }); 

const selected = $('#dropdown option:selected').text(); 

$('#email').val('user@example.com'); 

$('#submitBtn').prop('disabled', true); 

$('#submitBtn').prop('disabled', false); 

function shuffleArray(arr) { return arr.sort(() => 0.5 - Math.random()); } 

const clone = $('#template').clone().appendTo('#container'); 

const child = $('#parent').find('.child-class'); 

$('#box').fadeOut(0).delay(500).fadeIn(300); 

const data = [{ name: 'Alice' }, { name: 'Bob' }]; $.each(data, function(i, item) { console.log(item.name); }); 

$('#container').load('/content.html'); 

$.post('/submit', { name: 'Parth' }, function(response) { console.log('Success:', response); });