searching the dom

find HTML elements of type 'div'
find element with id 'example'
find elements with class 'example'
find input elements of type text
find anchor elements having titles starting with 'example'
find anchor elements having titles ending with 'example'
get an attribute from a html element
var url = $('#example').attr('href');
getting the text contained by an element
var text = $('#example').text();
finding elements containing specified text
$("div:contains('partial match')")
finding elements with contained text matching exactly
$('#example').filter(function() { return $.text([this]) === 'exact match'; });
select children of a jquery match
iterate selector results
$('a').each(function() {
    console.log('link:' + $(this).attr('href'));
only do something if the selector has matches
if ($(selector).length ) {
documentation on selectors

manipulating the page


getting current visibility
var visible = $(this).is(":visible")
show an element
hide an element
toggle between visible and invisible


apply css
$('[selector]').css('width', '250px');
getting current class
add css class to dom element(s)
remove css class from dom element(s)
toggle between 2 classes
$(this).toggleClass("[A] [B]");

inserting html

set inner html
prepend html
append html


getting the value of an input
check checkbox
$('[selector]').prop('checked', true);
checkbox is checked?


click on element(s) with selector
assign mouse click listener
$('[selector]').click(function() {
call function on mouse enter
$(selector).mouseenter(function() {
input change event
$("#foo").change(function() {...});
key up event
$("#foo").keyup(function() {...});
binding a key with ctrl + alt
$(document).bind('keydown', function(event) {
	if(event.altKey && event.ctrlKey) {
		var key = String.fromCharCode(event.which).toLowerCase();
javascript key codes


load the results of an ajax call into a dom element
ajax call with parameters
do HTTP POST with ajax
    		param1: "value1",
	    	param2: "value2"
	function(data, status){
register events on a top level element, so that they don't disappear when the content is replaced with ajax
.on( events [, selector ] [, data ], handler )
links for the "on" selector

keyboard shortcuts

keyboard shortcuts with jquery.hotkeys

$(document).bind('keyup', 'F1', function() {
	alert('F1 pressed');


official site
key descriptions