Basic Selectors

$('ul li:first');  // First element
$('ul li:last');   // Last element
$('ul li:eq(2)');  // Element at index 2
$('ul li:even');   // Even-indexed elements
$('ul li:odd');    // Odd-indexed elements
$('ul li:gt(3)');  // Index greater than 3
$('ul li:lt(3)');  // Index less than 3
$('div:not(".highlight")');  // Exclude class
$('div:has(".highlight")');  // Contains class

Attribute Selectors

$('[data-id]');           // Attribute exists
$('[data-id="user123"]'); // Exact value match
$('span[data-id="user123"]'); // Scoped to span

Form Selectors

$(':text');      // Text inputs
$(':password');  // Password fields
$(':file');      // File inputs
$(':button');    // Buttons
$(':checked');   // Checked elements
$('input:checked'); // Only inputs
$(':selected');  // Selected options

DOM Traversal Methods

let spanItem = $('span').eq(1);
spanItem.next();       // Immediate sibling
spanItem.nextAll();    // All following siblings
spanItem.nextUntil('#target'); // Until selector
spanItem.parent();     // Direct parent
spanItem.parents();    // All ancestors
spanItem.parentsUntil('html'); // Until root
$('div').find('span'); // Descendant search
$('div').filter('#specific'); // Filter set
$('div span').first(); // First match

DOM Manipulation

Class Operations

$('div').removeClass('active');
$('div').addClass('active');
$('div').hasClass('active');
$('div').toggleClass('active');

Chaining

$('p').first().css('color','red')
       .next().css('color','blue');

Position Handling

$(window).scrollTop(); // Scroll position

Content Manipulation

$('div').text();             // Get text
$('div').text('New content'); // Set text
$('div').html();              // Get HTML
$('div').html('<b>Content</b>'); // Set HTML
$('input').val();             // Get value
$('input').val('New value');  // Set value

Node Operations

$(container).append(child); // Add to end
$(child).appendTo(container); // Append child

Cloning Elements

$("button").on("click", function() {
    $(this).clone(true).insertAfter(this);
});

Event Handling

// Basic syntax
$('.item').on('click', function() {
    console.log('Clicked');
});

// Form input monitoring
$('input').on('input', function() {
    console.log($(this).val());
});

// Event propagation control
$('span').on('click', function(e) {
    e.stopPropagation();
});

// Event delegation
$('body').on('click', '.dynamic', function() {
    alert('Delegated event');
});

Animations

$('div').hide(1000);
$('div').show(1000);
$('div').slideUp(1000);
$('div').slideDown(1000);
$('div').fadeOut(1000);
$('div').fadeIn(1000);
$('div').fadeTo(1000, 0.5);

Iterasion

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

Data Storage

$('p').data('info', 'metadata');
console.log($('p').data('info'));
$('p').removeData('info');