jQuery DOM Manipulation
Manipulating HTML elements and attributes
Get and Set Content
$('div').text(); # get text content
$('div').text('Hello'); # set text content
$('div').html(); # get HTML content
$('div').html('Hello
'); # set HTML content
Attributes
$('img').attr('src'); # get attribute
$('img').attr('src', 'image.jpg'); # set attribute
$('img').removeAttr('src'); # remove attribute
CSS Classes
$('div').addClass('active'); # add class
$('div').removeClass('active'); # remove class
$('div').toggleClass('active'); # toggle class
$('div').hasClass('active'); # check if has class
CSS Styles
$('div').css('color'); # get CSS property
$('div').css('color', 'red'); # set CSS property
$('div').css({ # set multiple properties
'color': 'red',
'font-size': '16px'
});
Add and Remove Elements
$('div').append('Text
'); # append inside
$('div').prepend('Text
'); # prepend inside
$('div').after('Text
'); # insert after
$('div').before('Text
'); # insert before
$('div').remove(); # remove element
Form Values
$('input').val(); # get input value
$('input').val('text'); # set input value