jQuery Selectors

jQuery Selectors

jQuery Selectors allow you to select and manipulate the elements you can select the element by its tag name,id,class etc.


You can select any element with jQuery syntax $(selector).


Select Element By Tag Name

It selects the elements by its tag name.


$(document).ready(function(){
  $("p").click(function(){
    $("a").show();
  });
});



Select Element By Id

It selects the elements by its id attribute.


$(document).ready(function(){
  $("#demo").click(function(){
    $("#p1").show();
  });
});



Select Element By Class Name

It selects the elements by its class name.


$(document).ready(function(){
  $(".demo").click(function(){
    $(".p1").show();
  });
});


Some More jQuery Selectors

  • $("*")is used to select all elements present in the webpage

  • $(this)is used to select the current element

  • $("p.intro")is used to select all <p> elements with class name="intro"

  • $("p:first")is used to select the first <p> element

  • $("[href]")is used to select all elements with an href attribute

  • $("a[target!='_blank']")is used to select all <a> elements with a target attribute value NOT equal to "_blank"

  • $("a[target='_blank']")is used to select all <a> elements with a target attribute value equal to "_blank"

  • $("ul li:first")is used to select the first <li> element of the first <ul>

  • $("ul li:first-child")is used to select the first <li> element of every <ul>

  • $(":button")is used to select all >input< elements of type="button"

  • $("tr:even")is used to select all even >tr< elements

  • $("tr:odd")is used to select all odd >tr< elements

PreviousNext

Join Us And Get Our Latest Tutorials Updates Via Email