jQuery Multiple-Choice Questions (MCQs)

jQuery is a JavaScript library designed to simplify HTML DOM tree traversal and manipulation, as well as event handling, CSS animation, and Ajax. It is free, open-source software using the permissive MIT License.

jQuery MCQs: This section contains jQuery Multiple-Choice Questions with Answers. These jQuery MCQs are written for beginners as well as advanced, practice these MCQs to enhance and test the knowledge of jQuery.

List of jQuery MCQs

1. jQuery is a ______.

1. JavaScript Library
2. JSON Library
3. Java Library
4. JSON and CSS Library

Answer: A) JavaScript Library

Explanation:

jQuery is a JavaScript Library.

2. To work with jQuery, you should have the basic knowledge of these topics?

1. HTML
2. CSS
3. JavaScript
4. All of the above

Answer: D) All of the above

Explanation:

To work with jQuery, you should have the basic knowledge of HTML, CSS, and JavaScript.

3. Who developed jQuery?

1. John Richard
2. John Resig
3. John Carter
4. John Alexander

Answer: B) John Resig

Explanation:

John Resig developed jQuery.

4. In which year jQuery was initial released?

1. 2004
2. 2005
3. 2006
4. 2007

Answer: C) 2006

Explanation:

jQuery was initial released on August 26, 2006.

5. Is jQuery case-sensitive?

1. Yes
2. No

Answer: A) Yes

Explanation:

Yes, jQuery is case-sensitive.

ADVERTISEMENT

6. Which feature(s) jQuery contains?

1. HTML/DOM manipulation
2. CSS manipulation
3. HTML event methods
4. Effects and animations
5. AJAX
6. Utilities
7. All of the above

Answer: G) All of the above

Explanation:

All of the above features jQuery contains.

7. Which sign is used to define/access jQuery?

1. $
2. .
3. &
4. #

Answer: A) $

Explanation:

$ sign is used to define/access jQuery.

8. Which jQuery is used to hide the current element?

1. $(this).hideelement()
2. $(this).hide(‘true’)
3. $(this).hide(0)
4. $(this).hide()

Answer: D) $(this).hide()

Explanation:

The $(this).hide() method is used to hide the current element.

9. Which is the correct jQuery statement to hide all <div> elements?

1. $(“div”).hide()
2. $(div).hide()
3. $(“.div”).hide()
4. $(“#div”).hide()

Answer: A) $(“div”).hide()

Explanation:

The $(“div”).hide() statement can be used to hide all <div> elements.

10. Which is the correct jQuery statement to hide all elements having class name “new”?

1. $(“new”).hide()
2. $(new).hide()
3. $(“.new”).hide()
4. $(“#new”).hide()

Answer: C) $(“.new”).hide()

Explanation:

The $(“.new”).hide() statement can be used to hide all elements having class name “new”.

ADVERTISEMENT

11. Which is the correct jQuery statement to hide all elements having id name “new”?

1. $(“new”).hide()
2. $(new).hide()
3. $(“.new”).hide()
4. $(“#new”).hide()

Answer: D) $(“#new”).hide()

Explanation:

The $(“#new”).hide() statement can be used to hide all elements having id name “new”.

12. What is the use of jQuery Selectors?

1. jQuery selectors are used to select and manipulate HTML element(s).
2. jQuery selectors are used to import the HTML elements from the other file.
3. jQuery selectors are used to select and manipulate JSON elements(s).
4. jQuery selectors are used to select and manipulate ReactJS classes.

Answer: A) jQuery selectors are used to select and manipulate HTML element(s)

Explanation:

jQuery selectors are used to select and manipulate HTML element(s).

13. Which is the correct jQuery selector statement to select all <div> elements?

1. $(“.div”)
2. $(“#div”)
3. $(“div”)
4. $(“<div>”)

Answer: C) $(“div”)

Explanation:

The statement $(“div”) is the correct syntax to select all <div> elements.

14. Which sign is used for class selector?

1. $class
2. .class
3. #class
4. None

Answer: C) .class

Explanation:

The dot sign (.) i.e., .class is used for the class selector.

15. Which sign is used for id selector?

1. $id
2. .id
3. #id
4. None

Answer: C) #id

Explanation:

The hash sign (#) i.e., #id is used for the id selector.

ADVERTISEMENT

16. Why #id selectors are used for?

1. To select all elements having the id
2. To select all elements without having the id
3. To select all elements having the id within a specified <div>
4. To select all elements having the id within a specified section.

Answer: C) To select all elements having the id within a specified <div>

Explanation:

The #id selectors are used to select all elements having the id.

17. Which is the correct jQuery selector to select all elements?

1. $(“all”)
2. $(“*.*”)
3. $(“*”)
4. $(“***”)

Answer: C) $(“*”)

Explanation:

The $(“*”) selector is used to select all elements.

18. Which is the correct jQuery selector to select current HTML element?

1. $(this)
2. $(cur)
3. $(.this)
4. $(#this)

Answer: A) $(this)

Explanation:

The $(this) selector is used to select current HTML elements.

19. Which is the correct jQuery selector to select all <div> elements with class name “new”?

1. $(“.new”)
2. $(“div.new”)
3. $(“.div.new”)
4. $(“.div#new”)

Answer: B) $(“div.new”)

Explanation:

The $(“div.new”) selector is used to select all <div> elements with class name “new”.

20. Which is the correct jQuery selector to select the first HTML element?

1. $(“element_name.first”)
2. $(“element_name#first”)
3. $(“element_name::first”)
4. $(“element_name:first”)

Answer: D) $(“element_name:first”)

Explanation:

The $(“element_name:first”) selector is used to select the first HTML element.

ADVERTISEMENT

21. Which is the correct jQuery selector to select the first <div> of the HTML document?

1. $(“div.first”)
2. $(“div#first”)
3. $(“div::first”)
4. $(“div:first”)

Answer: D) $(“div:first”)

Explanation:

The $(“div:first”) selector is used to select the first <div> of the HTML document.

22. Which is the correct jQuery selector to select the first list item of <ul> element?

1. $(“ul li:first”)
2. $(“ul:first”)
3. $(“li:first”)
4. $(“ul.li:first”)

Answer: A) $(“ul li:first”)

Explanation:

The $(“ul li:first”) selector is used to select the first list item of <ul> element.

23. Which is the correct jQuery selector to select the first list item of every <ul> element?

1. $(“ul li:first-child”)
2. $(“ul li:first.*”)
3. $(“li:first-child”)
4. $(“ul:first-child”)

Answer: A) $(“ul li:first-child”)

Explanation:

The $(“ul li:first-child”) selector is used to select the first list item of every <ul> element.

24. Which is the correct jQuery selector to select all elements having “href” attribute?

1. $(“a.[href]”)
2. $(“a:[href]”)
3. $(“[href].*”)
4. $(“[href]”)

Answer: D) $(“[href]”)

Explanation:

The $(“[href]”) selector is used to select all elements having href attribute.

25. Which is the correct jQuery selector to select all <button> elements and <input> elements with type=”input”?

1. $(“.button”)
2. $(“:button”)
3. $(“button”,”input type=”button”)
4. $(“:button,:input”)

Answer: B) $(“:button”)

Explanation:

The $(“:button”) selector is used to select all <button> elements and <input> elements with type=”input”.

26. Which is the correct jQuery selector to select all even table rows?

1. $(“tr::even”)
2. $(“tr.even”)
3. $(“tr:even”)
4. $(“tr:#even”)

Answer: C) $(“tr:even”)

Explanation:

The $(“tr:even”) selector is used to select all even table rows.

27. Which is the correct jQuery selector to select all odd table rows?

1. $(“tr::odd”)
2. $(“tr.odd”)
3. $(“tr:odd”)
4. $(“tr:#odd”)

Answer: C) $(“tr:odd”)

Explanation:

The $(“tr:odd”) selector is used to select all odd table rows.

28. Which method is used to attach an event handler function to an HTML element on mouse click?

1. click()
2. Click()
3. dblclick()
4. DblClick()

Answer: A) click()

Explanation:

The jQuery method click() is used to attach an event handler function to an HTML element on mouse click.

29. Which method is used to attach an event handler function to an HTML element on mouse double click?

1. click()
2. Click()
3. dblclick()
4. DblClick()

Answer: C) dblclick()

Explanation:

The jQuery method dblclick() is used to attach an event handler function to an HTML element on mouse double click.

30. Which method is used to attach an event handler function to an HTML element when the mouse pointer enters the HTML element?

1. mouseover()
2. mousevisit()
3. mouse-enter()
4. mouseenter()

Answer: D) mouseenter()

Explanation:

The jQuery method mouseenter() is used to attach an event handler function to an HTML element when the mouse pointer enters the HTML element.

ADVERTISEMENT

31. Which method is used to attach an event handler function to an HTML element when the mouse pointer leaves the HTML element?

1. mouseLeave()
2. mouseleave()
3. mouse-leave()
4. mouseexit()

Answer: B) mouseleave()

Explanation:

The jQuery method mouseleave() is used to attach an event handler function to an HTML element when the mouse pointer leaves the HTML element.

32. Which method is used to attach an event handler function to an HTML element when the left, middle or right mouse button is pressed down, while the mouse is over the HTML element?

1. mousedown()
2. mouseover()
3. mousepress()
4. mousekey()

Answer: A) mousedown()

Explanation:

The jQuery method mousedown() is used to attach an event handler function to an HTML element when the left, middle or right mouse button is pressed down, while the mouse is over the HTML element.

33. Which method is used to attach an event handler function to an HTML element when the left, middle or right mouse button is released, while the mouse is over the HTML element?

1. mouseup()
2. mouseover()
3. mouseabove()
4. mousekey()

Answer: A) mouseup()

Explanation:

The jQuery method mouseup() is used to attach an event handler function to an HTML element when the left, middle or right mouse button is released, while the mouse is over the HTML element.

34. Which method is used to attach an event handler function to an HTML element when the mouse moves over the HTML elements?

1. mousemove()
2. mouseover()
3. hover()
4. mousehover()

Answer: C) hover()

Explanation:

The jQuery method hover() is used to attach an event handler function to an HTML element when the mouse moves over the HTML elements.

35. Which method is used to attach an event handler function to an HTML element when the form field gets focus?

1. focused()
2. focuses()
3. focuselement()
4. focus()

Answer: D) focus()

Explanation:

The jQuery method focus() is used to attach an event handler function to an HTML element when the form field gets focus.

36. Which method is used to attach an event handler function to an HTML element when the form field loses focus?

1. blur()
2. leave()
3. focusleave()
4. leavefocus()

Answer: A) blur()

Explanation:

The jQuery method blur() is used to attach an event handler function to an HTML element when the form field loses focus.

37. Which method is used to attach one or more event handlers for the selected elements?

1. at()
2. atelements()
3. on()
4. focuson()

Answer: C) on()

Explanation:

The jQuery method on() is used to attach one or more event handlers for the selected elements.

38. What is the use of jQuery method toggle()?

1. To hide shown elements and to show hidden elements
2. To remove current element
3. To shift current element at the previous position
4. All of the above

Answer: A) To hide shown elements and to show hidden elements

Explanation:

The toggle() method is used to hide the shown elements and to show the hidden elements.

39. Which jQuery method is used to fade in a hidden element?

1. fade()
2. fadeIn()
3. fadeOut()
4. fadeToggle()

Answer: B) fadeIn()

Explanation:

The jQuery fadeIn() method is used to fade in a hidden element.

40. What is the syntax of jQuery fadeIn() method?

1. $(selector).fadeIn();
2. $(selector).fadeIn(callback, speed);
3. $(selector).fadeIn(callback);
4. $(selector).fadeIn(speed,callback);

Answer: D) $(selector).fadeIn(speed,callback);

Explanation:

The syntax of jQuery method fadeIn() is:

$(selector).fadeIn(speed,callback);

41. Which jQuery method is used to fade out a visible element?

1. fadeout()
2. fadeIn()
3. fadeOut()
4. fadeToggle()

Answer: C) fadeOut()

Explanation:

The jQuery fadeOut() method is used to fade out a visible element.

42. What is the syntax of jQuery fadeOut() method?

1. $(selector).fadeOut();
2. $(selector).fadeOut(callback, speed);
3. $(selector).fadeOut(callback);
4. $(selector).fadeOut(speed,callback);

Answer: D) $(selector).fadeOut(speed,callback);

Explanation:

The syntax of jQuery method fadeOut() is:

$(selector).fadeOut(speed,callback);

43. Which jQuery method toggles between the fadeIn() and fadeOut() methods?

1. toggle()
2. Toggle()
3. fadeToggle()
4. fadetoggle()

Answer: C) fadeToggle()

Explanation:

The jQuery fadeToggle() method toggles between the fadeIn() and fadeOut() methods.

44. What is the syntax of jQuery fadeToggle() method?

1. $(selector).fadeToggle();
2. $(selector).fadeToggle(callback, speed);
3. $(selector).fadeToggle(callback);
4. $(selector).fadeToggle(speed,callback);

Answer: D) $(selector).fadeToggle(speed,callback);

Explanation:

The syntax of jQuery method fadeToggle() is:

$(selector).fadeToggle(speed,callback);

45. Which jQuery method allows fading to a given opacity (value between 0 and 1)?

1. fade()
2. fadeOpacity()
3. fadeTo()
4. fadeto()

Answer: C) fadeTo()

Explanation:

The jQuery fadeTo() method allows fading to a given opacity (value between 0 and 1).

46. Which is the correct jQuery statement to fade out a <p> element?

1. $(“p”).fadeOut();
2. $(“#p”).fadeOut();
3. $(“.p”).fadeOut();
4. $(“p”).fadeout();

Answer: A) $(“p”).fadeOut();

Explanation:

The jQuery statement to fade out a p elements is:

$(“p”).fadeOut();

47. Which is the correct jQuery statement to fade out a <p> element with duration effect “slow”?

1. $(“p”).fadeOut(“slow”);
2. $(“#p”).fadeOut(“slow”);
3. $(“.p”).fadeOut(“slow”);
4. $(“p”).fadeout();

Answer: A) $(“p”).fadeOut(“slow”);

Explanation:

The jQuery statement to fade out a <p> elements with duration effect “slow” is:

$(“p”).fadeOut(“slow”);

48. Which jQuery method is used to slide down an element?

1. slideBottom()
2. slideDown()
3. slidedown()
4. slide()

Answer: B) slideDown()

Explanation:

The jQuery slideDown() method is used to slide down an element.

49. Which jQuery method is used to slide up an element?

1. slideUp()
2. slideBottom()
3. slidebottom()
4. slide()

Answer: A) slideUp()

Explanation:

The jQuery slideUp() method is used to slide up an element.

50. Which jQuery method toggles between the slideDown() and slideUp() methods?

1. slide ()
2. slideSwitch()
3. slidetoggle()
4. slideToggle()

Answer: D) slideToggle()

Explanation:

The jQuery slideToggle() method toggles between the slideDown() and slideUp() methods.

51. Which jQuery method is used to create custom animations?

1. animation()
2. slidAnimate()
3. animate()
4. SlideAnimate()

Answer: C) animate()

Explanation:

The jQuery animate() method is used to create custom animations.

52. What is the correct syntax of animate() method?

1. $(selector).animate({params},speed,callback);
2. $(#selector).animate({params},speed,callback);
3. $(selector).animate(speed,callback);
4. $(selector).animate({speed,callback,params});

Answer: A) $(selector).animate({params},speed,callback);

Explanation:

The correct syntax of animate() method is:

$(selector).animate({params},speed,callback);

53. In the syntax of animate() method, why params parameter is used?

1. It is used to define the speed of the animation
2. It is used to define the mouse events on the HTML element
3. It is used to define the CSS property to be animated
4. None of the above

Answer: C) It is used to define the CSS property to be animated

Explanation:

The params parameter of jQuery animate() method is used to define the CSS property to be animated.

54. In the syntax of animate() method, what is/are the valid value(s) of speed parameter?

1. slow
2. fast
3. milliseconds
4. All of the above

Answer: D) All of the above

Explanation:

The following are the correct value of the speed parameter are:

• slow
• fast
• milliseconds

55. Which jQuery method is used to stop an animation before it is finished?

1. animate(false)
2. animate(‘false’)
3. animate(“false”)
4. stop()

Answer: D) stop()

Explanation:

The jQuery method stop() is used to stop an animation before it is finished.

56. What is the correct syntax of stop() method?

1. $(selector).stop(stopAll,goToEnd);
2. $(selector).stop(speed,callback);
3. $(selector).stop(stopAll,goToEnd,callback);
4. $(selector).stop(stopAll,speed);

Answer: A) $(selector).stop(stopAll,goToEnd);

Explanation:

The correct syntax of stop() method is:

$(selector).stop(stopAll,goToEnd);

57. In jQuery DOM, what does DOM stand for?

1. Data Object Model
2. Document Object Manipulation
3. Document Object Model
4. Document On Model

Answer: D) Document Object Model

Explanation:

In jQuery DOM, DOM stands for Document Object Model.

58. Which jQuery DOM method is used to set or return the text content of selected elements?

1. content()
2. text()
3. html()
4. val()

Answer: B) text()

Explanation:

The jQuery DOM method text() is used to set or return the text content of selected elements.

59. Which jQuery DOM method is used to set or return the content of selected elements (including HTML markup)?

1. content()
2. text()
3. html()
4. val()

Answer: C) html()

Explanation:

The jQuery DOM method html() is used to set or return the content of selected elements (including HTML markup).

60. Which jQuery DOM method is used to set or return the value of form fields?

1. content()
2. text()
3. html()
4. val()

Answer: D) val()

Explanation:

The jQuery DOM method val() is used to set or return the value of form fields.

61. Which is the correct jQuery statement to get the text content of an HTML element having id “notification”?

1. $(“notification”).text()
2. $(“#notification”).text()
3. $(“.notification”).text()
4. $(“#notification”).val()

Answer: B) $(“#notification”).text()

Explanation:

The jQuery statement $(“#notification”).text() will return the text content of the HTML document having id “notification”.

62. Which jQuery DOM method is used to get the attribute value?

1. attr()
2. attribute()
3. attrib()
4. val()

Answer: A) attr()

Explanation:

The jQuery DOM method attr() is used to get the attribute value.

63. Which is the correct jQuery statement to get the value “href” attribute having id “top”?

1. $(“top”).attr(“href”)
2. $(“.top”).attr(“href”)
3. $(“$top”).attr(“href”)
4. $(“#top”).attr(“href”)

Answer: D) $(“#top”).attr(“href”)

Explanation:

The jQuery statement $(“#top”).attr(“href”) will return the the value href attribute having id “top”.

64. Which jQuery DOM method is used to insert content at the end of the selected elements?

1. insert()
2. add()
3. append()
4. appendValue()

Answer: C) append()

Explanation:

The jQuery DOM method append() is used to insert content at the end of the selected elements.

65. Which jQuery DOM method is used to insert content at the beginning of the selected elements?

1. insert()
2. before()
3. append()
4. prepend()

Answer: D) prepend()

Explanation:

The jQuery DOM method prepend() is used to insert content at the beginning of the selected elements.

66. Which jQuery DOM method is used to insert content after the selected elements?

1. after()
2. postpend()
3. addafter()
4. prepend()

Answer: A) after()

Explanation:

The jQuery DOM method after() is used to insert content after the selected elements.

67. Which jQuery DOM method is used to insert content before the selected elements?

1. before()
2. addbefore()
3. addprepend()
4. prepend()

Answer: A) before()

Explanation:

The jQuery DOM method before() is used to insert content before the selected elements.

68. Which is the correct syntax to insert content at the end of the <p> elements?

1. $(“#p”).append(“Text to be added”);
2. $(“p”).before(“Text to be added”);
3. $(“p”).append(“Text to be added”);
4. $(“p”).prepend(“Text to be added”);

Answer: C) $(“p”).append(“Text to be added”);

Explanation:

The correct syntax to insert content at the end of the <p> elements is:

$(“p”).append(“Text to be added”);

69. Which is the correct syntax to insert content at the beginning of the <p> elements?

1. $(“#p”).before(“Text to be added”);
2. $(“p”).addafter(“Text to be added”);
3. $(“p”).after(“Text to be added”);
4. $(“p”).prepend(“Text to be added”);

Answer: D) $(“p”).prepend(“Text to be added”);

Explanation:

The correct syntax to insert content at the beginning of the <p> elements is:

$(“p”).prepend(“Text to be added”);

70. Which is the correct syntax to insert content after the <div> elements?

1. $(“div”).after(“Text to be added”);
2. $(“div”).postpend(“Text to be added”);
3. $(“div”).addafter(“Text to be added”);
4. $(“#div”).after(“Text to be added”);

Answer: A) $(“div”).after(“Text to be added”);

Explanation:

The correct syntax to insert content after the <div> elements is:

$(“div”).after(“Text to be added”);

71. Which is the correct syntax to insert content before the <div> elements?

1. $(“div”).before(“Text to be added”);
2. $(“div”).pretpend(“Text to be added”);
3. $(“div”).addbefore(“Text to be added”);
4. $(“#div”).before(“Text to be added”);

Answer: A) $(“div”).before(“Text to be added”);

Explanation:

The correct syntax to insert content before the <div> elements is:

$(“div”).before(“Text to be added”);

72. What is the difference between remove() and empty() methods?

1. remove() removes the selected element and its child elements while empty() removes the child elements of the selected element
2. remove() removes the child elements of the selected element while empty() removes the selected elements and its child elements
3. remove() removes the child elements while empty() removes the content of the selected element
4. remove() removes the child elements while empty() removes the content of the selected element and its child elements

Answer: A) remove() removes the selected element and its child elements while empty() removes the child elements of the selected element

Explanation:

The difference between remove() and empty() methods is: remove() removes the selected element and its child elements while empty() removes the child elements of the selected element.

73. Write a jQuery statement to remove all child elements only from the element having id “notif”?

1. $(“notif”).empty();
2. $(“#notif”).empty();
3. $(“.notif”).empty();
4. $(“<notif>”).empty();

Answer: B) $(“#notif”).empty();

Explanation:

The jQuery statement to remove all child elements only from the element having id “notif” is:

$(“#notif”).empty();

74. Write a jQuery statement to remove all <p> elements with class=”prog”?

1. $(“.prog”).remove();
2. $(“p”).empty(“.prog”);
3. $(“p”).remove(“.prog”);
4. $(“p.prog”).remove();

Answer: C) $(“p”).remove(“.prog”);

Explanation:

The jQuery statement to removes all <p> elements with class=”prog” is:

$(“p”).remove(“.prog”);

75. Write a jQuery statement to remove all <pre> elements with class=”prog” and class=”old”?

1. $(“.prog#old”).remove();
2. $(“pre”).empty(“.prog”,”.old”);
3. $(“pre”).remove(“.prog, .old”);
4. $(“pre.prog.old”).remove();

Answer: C) $(“pre”).remove(“.prog, .old”);

Explanation:

The jQuery statement to remove all <pre> elements with class=”prog” and class=”old” is:

$(“pre”).remove(“.prog, .old”);

76. Which method is used to add CSS class to the selected elements?

1. add()
2. addClass()
3. addClasses()
4. AddClasses()

Answer: B) addClass()

Explanation:

The jQuery method addClass() is used to add CSS class to the selected elements.

77. Can we add more than one CSS classes to the selected elements using the addClass() method?

1. Yes
2. No

Answer: A) Yes

Explanation:

Yes, we can add more than one CSS classes to the selected elements using the addClass() method.

78. Which method is used to remove CSS class to the selected elements?

1. removeCSS()
2. removeClass()
3. removeClasseses()
4. RemoveClass()

Answer: B) removeClass()

Explanation:

The jQuery method removeClass() is used to remove CSS class to the selected elements.

79. Which method is used to set or get the CSS style attribute?

1. cssAttribute()
2. attribute()
3. attr()
4. css()

Answer: D) css()

Explanation:

The jQuery method css() is used to get or set the CSS style attribute.

80. Which is the correct syntax to get the value of a CSS style attribute/property using the css() method?

1. css(“propertyname”);
2. css(propertyname);
3. css(“.propertyname”);
4. css(“#propertyname”);

Answer: A) css(“propertyname”);

Explanation:

The correct syntax to get the value of a CSS style attribute/property using the css() method is: css(“propertyname”);

81. Which is the correct syntax to set the value of a CSS style attribute/property using the css() method?

1. css(“propertyname”=”value”);
2. css(“propertyname”,”value”);
3. css(“propertyname”:”value”);
4. css(“propertyname”:=”value”);

Answer: B) css(“propertyname”,”value”);

Explanation:

The correct syntax to set the value of a CSS style attribute/property using the css() method is:

css(“propertyname”,”value”);

82. Which is the correct jQuery statement to set background color and text decoration to all <p> elements?

1. $(“p”).css({“background-color”: “#f1f1f1”; “text-decoration”: “underline”});
2. $(“#p”).css({“background-color”: “#f1f1f1”; “text-decoration”: “underline”});
3. $(“p”).css({“background-color”: “#f1f1f1”, “text-decoration”: “underline”});
4. $(“#p”).css({“background-color”: “#f1f1f1”, “text-decoration”: “underline”});

Answer: C) $(“p”).css({“background-color”: “#f1f1f1”, “text-decoration”: “underline”});

Explanation:

The correct jQuery statement to set background color and text decoration to all <p> elements is:

$(“p”).css({“background-color”: “#f1f1f1”, “text-decoration”: “underline”});

83. Which jQuery method is used to get or set the width of an HTML element?

1. cssWidth()
2. Csswidth()
3. lenght()
4. width()

Answer: D) width()

Explanation:

The jQuery method width() is used to get or set the width of an HTML element.

84. Which jQuery method is used to get or set the height of an HTML element?

1. cssHeight()
2. CssHeight()
3. height()
4. getHeight()

Answer: C) height()

Explanation:

The jQuery method height() is used to get or set the height of an HTML element.

85. Which jQuery methods are used to get or set the width and height of an HTML element including the paddings?

1. innerWidth() and innerHeight()
2. width() and height()
3. cssWidth() and cssHeight()
4. elementWidth() and elementHeight()

Answer: A) innerWidth() and innerHeight()

Explanation:

The jQuery methods innerWidth() and innerHeight() are used to get or set the width and height of an HTML element including the paddings.

86. Which jQuery methods are used to get or set the width and height of an HTML element including the paddings and borders?

1. outerWidth() and outerHeight()
2. width() and height()
3. cssWidth() and cssHeight()
4. elementWidth() and elementHeight()

Answer: A) outerWidth() and outerHeight()

Explanation:

The jQuery methods outerWidth() and outerHeight() are used to get or set the width and height of an HTML element including the paddings and borders.

87. Which are the jQuery methods for traversing up the DOM tree?

1. parent()
2. parents()
3. parentsUntil()
4. All of the above

Answer: D) All of the above

Explanation:

These are the jQuery methods for traversing up the DOM tree:

1. parent()
2. parents()
3. parentsUntil()

88. Which jQuery method is used to get the direct parent element of the selected element?

1. parent()
2. parents()
3. parentsUntil()
4. All of the above

Answer: A) parent()

Explanation:

jQuery method parent() is used to get the direct parent element of the selected element.

89. Which jQuery method is used to get the all ancestor elements of the selected element, all the way up to the document’s root element (<html>)?

1. parent()
2. parents()
3. parentsUntil()
4. All of the above

Answer: B) parents()

Explanation:

jQuery method parents() is used to get the all ancestor elements of the selected element, all the way up to the document’s root element (<html>).

90. Which jQuery method is used to get the all ancestor elements between two given arguments?

1. parent()
2. parents()
3. parentsUntil()
4. All of the above

Answer: C) parentsUntil()

Explanation:

jQuery method parentsUntil() is used to get the all ancestor elements between two given arguments.

91. There is a <pre> element, write a jQuery statement to get it’s parent?

1. $(“pre”).parent();
2. $(“pre”).parents();
3. $(“pre”).parentsUntil();
4. None of the above

Answer: A) $(“pre”).parent();

Explanation:

The correct jQuery statement to get the direct parent of a <pre> tag is:

$(“pre”).parent();

92. Which are the jQuery methods for traversing down the DOM tree?

1. children()
2. find()
3. childrens()
4. Both A. and B.

Answer: D) Both A. and B.

Explanation:

These are the jQuery methods for traversing down the DOM tree:

1. children()
2. find()

93. Which jQuery method is used to get all direct children of the selected element?

1. children()
2. find()
3. childrens()
4. Both A. and B.

Answer: A) children()

Explanation:

jQuery method children() is used to get all direct children of the selected element.

94. Which jQuery method is used to get descendant elements of the selected element, all the way down to the last descendant?

1. children()
2. find()
3. childrens()
4. Both A. and B.

Answer: B) find()

Explanation:

jQuery method find() is used to get descendant elements of the selected element, all the way down to the last descendant.

95. What will the following jQuery code do?

$(document).ready(function(){

  $(“pre”).siblings();

});

1. It will return all parent elements of <pre> element
2. It will return all children elements of <pre> element
3. It will return all sibling elements of <pre> element
4. It will return all nonrelative elements of <pre> element

Answer: C) It will return all sibling elements of <pre> element

Explanation:

The above code will return all sibling elements of <pre> element.

96. Which is the correct jQuery statement to change the color of all <p> elements which are sibling elements of <pre>?

1. $(“#pre”).siblings(“p”).css({“color”: “red”});
2. $(“.pre”).siblings(“p”).css({“color”: “red”});
3. $(“pre”).siblings(“.p”).css({“color”: “red”});
4. $(“pre”).siblings(“p”).css({“color”: “red”});

Answer: D) $(“pre”).siblings(“p”).css({“color”: “red”});

Explanation:

The correct jQuery statement to change the color of all <p> elements which are sibling elements of <pre> is:

$(“pre”).siblings(“p”).css({“color”: “red”});

97. Which jQuery method is used to get the next sibling element of the selected element?

1. sibling()
2. nextSibling()
3. next()
4. siblings()

Answer: C) next()

Explanation:

jQuery method next() is used to get the next sibling element of the selected element.

98. Which jQuery method is used to get the all next sibling element of the selected element?

1. siblingAll()
2. nextSiblingAll()
3. nextAll()
4. siblingsAll()

Answer: C) nextAll()

Explanation:

jQuery method nextAll() is used to get the all next sibling element of the selected element.

99. Let suppose there are multiple <h3> elements in an HTML document, which is the correct jQuery statement to get the first <h3> element?

1. $(“h3”).first();
2. $(“h3”).parent();
3. $(“h3”).firstParent();
4. $(“h3”).top();

Answer: A) $(“h3”).first();

Explanation:

The correct jQuery statement to get the first <h3> element is:

$(“h3”).first();

100. Let suppose there are multiple <h3> elements in an HTML document, which is the correct jQuery statement to get the last <h3> element?

1. $(“h3”).last();
2. $(“h3”).children();
3. $(“h3”).lastChild();
4. $(“h3”).down();

Answer: A) $(“h3”).last();

Explanation:

The correct jQuery statement to get the last <h3> element is:

$(“h3”).last();

Keywords: MCQ, jQUERY