{"id":16555,"date":"2016-07-06T00:53:46","date_gmt":"2016-07-06T00:53:46","guid":{"rendered":"http:\/\/www.oracletutoring.ca\/blog\/?p=16555"},"modified":"2016-07-06T00:56:35","modified_gmt":"2016-07-06T00:56:35","slug":"web-design-jquery-selectors-eqn","status":"publish","type":"post","link":"https:\/\/www.oracletutoring.ca\/blog\/web-design-jquery-selectors-eqn\/","title":{"rendered":"Web design:  jQuery selectors:  eq(n)"},"content":{"rendered":"<p><script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.12.4\/jquery.min.js\"><\/script><br \/>\n<script src=\"..\/jquery\/july5_2016.js\"><\/script><\/p>\n<p>jQuery, famously, offers selectors that a programmer can use to access virtually any element on the page.  This post gives an example of the eq(n) selector.<\/p>\n<p>When you click the demo button below, the third H will change.  The code:<\/p>\n<p><span style=\"font-family:monospace\">$(&#8220;thisclass:eq(2)&#8221;).css(&#8220;attribute&#8221;,&#8221;new_value&#8221;)<\/span><\/p>\n<p><span style=\"font-family:monospace\">:eq(2)<\/span> means the third element, since with computer science, the count starts at 0.<\/p>\n<table>\n<tr>\n<td class=\"july5_2016\">H<\/td>\n<td class=\"july5_2016\">H<\/td>\n<td class=\"july5_2016\">H<\/td>\n<td class=\"july5_2016\">H<\/td>\n<\/tr>\n<\/table>\n<p><button id=\"button_july5_2016\" style=\"color:white;background-color:brown; display:block;margin:auto\">Click me for demo!<\/button><\/p>\n<p><button id=\"button_july5_2016_refresh\" style=\"color:white;background-color:brown;display:block;margin:auto\">Click me to refresh!<\/button><\/p>\n<p>I&#8217;ll be giving more examples of jQuery selectors in future posts:)<\/p>\n<p>Source:<\/p>\n<p>Pollock, John.  <u>jQuery:  A Beginner&#8217;s Guide<\/u>.  Toronto:  McGraw-Hill, 2014.<\/p>\n<p>Jack of <a href=\"https:\/\/www.oracletutoring.ca\">Oracle Tutoring by Jack and Diane,<\/a> Campbell River, BC.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>jQuery, famously, offers selectors that a programmer can use to access virtually any element on the page. This post gives an example of the eq(n) selector. When you click the demo button below, the third H will change. The code: &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"more-link\" href=\"https:\/\/www.oracletutoring.ca\/blog\/web-design-jquery-selectors-eqn\/\"> <span class=\"screen-reader-text\">Web design:  jQuery selectors:  eq(n)<\/span> Read More &raquo;<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[105,1631,1691,837],"tags":[1693,1694,1692],"class_list":["post-16555","post","type-post","status-publish","format-standard","hentry","category-computer-science","category-css","category-jquery","category-web-design","tag-eqn","tag-selecting-an-element-by-number-in-jquery","tag-selector"],"_links":{"self":[{"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/posts\/16555","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/comments?post=16555"}],"version-history":[{"count":16,"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/posts\/16555\/revisions"}],"predecessor-version":[{"id":16572,"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/posts\/16555\/revisions\/16572"}],"wp:attachment":[{"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/media?parent=16555"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/categories?post=16555"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.oracletutoring.ca\/blog\/wp-json\/wp\/v2\/tags?post=16555"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}