{"id":88572,"date":"2025-06-29T15:57:29","date_gmt":"2025-06-29T08:57:29","guid":{"rendered":"https:\/\/itviec.com\/blog\/?p=88572"},"modified":"2025-06-29T22:32:08","modified_gmt":"2025-06-29T15:32:08","slug":"huong-dan-find-jquery","status":"publish","type":"post","link":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/","title":{"rendered":"Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">N\u1ed9i dung b\u00e0i vi\u1ebft<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#Tong_quan_ve_phuong_thuc_find_trong_jQuery\" >T\u1ed5ng quan v\u1ec1 ph\u01b0\u01a1ng th\u1ee9c find() trong jQuery<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#Cach_su_dung_find_trong_jQuery_de_chon_phan_tu_theo_class\" >C\u00e1ch s\u1eed d\u1ee5ng find() trong jQuery \u0111\u1ec3 ch\u1ecdn ph\u1ea7n t\u1eed theo class<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#So_sanh_find_voi_cac_phuong_thuc_khac_trong_jQuery\" >So s\u00e1nh find() v\u1edbi c\u00e1c ph\u01b0\u01a1ng th\u1ee9c kh\u00e1c trong jQuery<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#Cac_cau_hoi_thuong_gap_ve_find_class_jQuery\" >C\u00e1c c\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p v\u1ec1 find class jQuery<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#Tong_ket_ve_find_jQuery\" >T\u1ed5ng k\u1ebft v\u1ec1 find jQuery<\/a><\/li><\/ul><\/nav><\/div>\n\n<p><strong><em>Find jQuery l\u00e0 m\u1ed9t trong nh\u1eefng k\u1ef9 thu\u1eadt th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng khi c\u1ea7n truy xu\u1ea5t c\u00e1c ph\u1ea7n t\u1eed con theo class c\u1ee5 th\u1ec3 trong c\u00e2y DOM. Nh\u1edd v\u00e0o ph\u01b0\u01a1ng th\u1ee9c find() c\u1ee7a jQuery, l\u1eadp tr\u00ecnh vi\u00ean c\u00f3 th\u1ec3 d\u1ec5 d\u00e0ng l\u1ef1a ch\u1ecdn c\u00e1c ph\u1ea7n t\u1eed n\u1eb1m s\u00e2u b\u00ean trong c\u1ea5u tr\u00fac HTML m\u00e0 kh\u00f4ng c\u1ea7n vi\u1ebft nhi\u1ec1u d\u00f2ng code ph\u1ee9c t\u1ea1p.<\/em><\/strong><\/p>\n\n\n\n<p>\u0110\u1ecdc b\u00e0i vi\u1ebft sau \u0111\u1ec3 \u0111\u01b0\u1ee3c gi\u1ea3i \u0111\u00e1p chi ti\u1ebft h\u01a1n v\u1ec1:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>T\u1ed5ng quan v\u1ec1 ph\u01b0\u01a1ng th\u1ee9c <code>find()<\/code> trong jQuery.\u00a0<\/li>\n\n\n\n<li>2 c\u00e1ch th\u01b0\u1eddng d\u00f9ng <code>find()<\/code> \u0111\u1ec3 t\u00ecm c\u00e1c ph\u1ea7n t\u1eed class trong jQuery.\u00a0<\/li>\n\n\n\n<li>So s\u00e1nh <code>find()<\/code> v\u00e0 c\u00e1c ph\u01b0\u01a1ng th\u1ee9c kh\u00e1c nh\u01b0 <code>children()<\/code>, <code>closest()<\/code> v\u00e0 <code>filter()<\/code>.\u00a0<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-t\u1ed5ng-quan-v\u1ec1-ph\u01b0\u01a1ng-th\u1ee9c-find-trong-jquery\"><span class=\"ez-toc-section\" id=\"Tong_quan_ve_phuong_thuc_find_trong_jQuery\"><\/span><strong>T\u1ed5ng quan v\u1ec1 ph\u01b0\u01a1ng th\u1ee9c find() trong jQuery<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Ph\u01b0\u01a1ng th\u1ee9c <code>find()<\/code> l\u00e0 m\u1ed9t ph\u01b0\u01a1ng th\u1ee9c c\u00f3 s\u1eb5n trong jQuery, \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 t\u00ecm t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con (descendants) c\u1ee7a ph\u1ea7n t\u1eed \u0111\u00e3 ch\u1ecdn. <code>find()<\/code> s\u1ebd duy\u1ec7t to\u00e0n b\u1ed9 DOM t\u1eeb ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn, \u0111i xu\u1ed1ng \u0111\u1ebfn c\u00e1c ph\u1ea7n t\u1eed con cu\u1ed1i c\u00f9ng.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$(selector).find(descendant_selector)<\/code><\/pre>\n\n\n\n<p>Trong \u0111\u00f3:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>selector<\/code> l\u00e0 ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn m\u00e0 b\u1ea1n mu\u1ed1n t\u00ecm t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con c\u1ee7a n\u00f3.\u00a0<\/li>\n\n\n\n<li><code>descendant_selector<\/code> l\u00e0 tham s\u1ed1 b\u1eaft bu\u1ed9c, x\u00e1c \u0111\u1ecbnh lo\u1ea1i ph\u1ea7n t\u1eed con c\u1ea7n t\u00ecm (c\u00f3 th\u1ec3 l\u00e0 tag, class, id, etc.)<\/li>\n\n\n\n<li>Gi\u00e1 tr\u1ecb tr\u1ea3 v\u1ec1 s\u1ebd l\u00e0 m\u1ed9t jQuery object ch\u1ee9a t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con kh\u1edbp v\u1edbi \u0111i\u1ec1u ki\u1ec7n.<\/li>\n<\/ul>\n\n\n\n<p>V\u00ed d\u1ee5: Trong \u0111o\u1ea1n m\u00e3 d\u01b0\u1edbi \u0111\u00e2y, t\u1ea5t c\u1ea3 c\u00e1c th\u1ebb <code>&lt;span><\/code> n\u1eb1m b\u00ean trong th\u1ebb <code>&lt;div><\/code> s\u1ebd \u0111\u01b0\u1ee3c l\u00e0m n\u1ed5i b\u1eadt b\u1eb1ng m\u00e0u xanh l\u00e1 c\u00e2y.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;html>\n&lt;head>\n\u00a0\u00a0\u00a0\u00a0&lt;style>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.descendants * {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0display: block;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0border: 2px solid grey;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0color: lightgrey;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0padding: 5px;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0margin: 15px;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0&lt;\/style>\n\u00a0\u00a0\u00a0\u00a0&lt;script src=\"https:\/\/ajax.googleapis.com\/ajax\/libs\/\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0jquery\/3.3.1\/jquery.min.js\">&lt;\/script>\n\u00a0\u00a0\u00a0\u00a0&lt;script>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$(document).ready(function() {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$(\"div\").find(\"span\").css({\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"color\": \"green\",\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"border\": \"2px solid green\"\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/head>\n\n&lt;body>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"descendants\"\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0style=\"width:500px;\">This is the current element !!!\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p>This is the paragraph element !!!\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;span> This is span element !!!&lt;\/span>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p>This is the paragraph element !!!\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;span>This is span element !!!&lt;\/span>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/p>\n\u00a0\u00a0\u00a0\u00a0&lt;\/div>\n&lt;\/body>\n\n&lt;\/html><\/code><\/pre>\n\n\n\n<p>Gi\u1ea3i th\u00edch v\u00ed d\u1ee5 tr\u00ean:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>T\u00ecm t\u1ea5t c\u1ea3 c\u00e1c th\u1ebb &lt;span> n\u1eb1m b\u00ean trong ph\u1ea7n t\u1eed <code>&lt;div><\/code>, sau \u0111\u00f3 thay \u0111\u1ed5i m\u00e0u ch\u1eef v\u00e0 vi\u1ec1n c\u1ee7a c\u00e1c th\u1ebb <code>&lt;span><\/code> n\u00e0y th\u00e0nh m\u00e0u xanh l\u00e1 c\u00e2y.<\/li>\n\n\n\n<li>C\u00f3 1 th\u1ebb <code>&lt;div><\/code> v\u1edbi class l\u00e0 descendants.<\/li>\n\n\n\n<li>B\u00ean trong <code>&lt;div><\/code> n\u00e0y l\u00e0 2 \u0111o\u1ea1n <code>&lt;p><\/code>, m\u1ed7i \u0111o\u1ea1n ch\u1ee9a m\u1ed9t th\u1ebb <code>&lt;span><\/code>.<\/li>\n\n\n\n<li><strong><code>$(document).ready(...)<\/code>: <\/strong>\u0110\u1ea3m b\u1ea3o m\u00e3 jQuery ch\u1ec9 ch\u1ea1y sau khi trang t\u1ea3i xong.<\/li>\n\n\n\n<li><strong><code>$(\"div\").find(\"span\")<\/code>:<\/strong> Ch\u1ecdn t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed <code>&lt;div><\/code> tr\u00ean trang. T\u1eeb \u0111\u00f3, t\u00ecm t\u1ea5t c\u1ea3 th\u1ebb <code>&lt;span><\/code> n\u1eb1m b\u00ean trong nh\u1eefng th\u1ebb <code>&lt;div><\/code> \u0111\u00f3.<\/li>\n\n\n\n<li><strong><code>.css({...})<\/code>:<\/strong> \u00c1p d\u1ee5ng c\u00e1c ki\u1ec3u CSS m\u1edbi cho nh\u1eefng th\u1ebb <code>&lt;span><\/code> t\u00ecm \u0111\u01b0\u1ee3c<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-cach-s\u1eed-d\u1ee5ng-find-trong-jquery-d\u1ec3-ch\u1ecdn-ph\u1ea7n-t\u1eed-theo-class\"><span class=\"ez-toc-section\" id=\"Cach_su_dung_find_trong_jQuery_de_chon_phan_tu_theo_class\"><\/span><strong>C\u00e1ch s\u1eed d\u1ee5ng find() trong jQuery \u0111\u1ec3 ch\u1ecdn ph\u1ea7n t\u1eed theo class<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-cu-phap-chung-d\u1ec3-tim-ph\u1ea7n-t\u1eed-con-co-class-c\u1ee5-th\u1ec3\"><strong>C\u00fa ph\u00e1p chung \u0111\u1ec3 t\u00ecm ph\u1ea7n t\u1eed con c\u00f3 class c\u1ee5 th\u1ec3<\/strong><\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code>$(parent_selector).find('.class_name')<\/code><\/pre>\n\n\n\n<p><strong>V\u00ed d\u1ee5:<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ T\u00ecm t\u1ea5t c\u1ea3 ph\u1ea7n t\u1eed con c\u00f3 class \"highlight\" trong div c\u00f3 id \"container\"$(\"#container\").find('.highlight').css('background-color', 'yellow');\n\/\/ T\u00ecm t\u1ea5t c\u1ea3 ph\u1ea7n t\u1eed con c\u00f3 class \"item\" trong t\u1ea5t c\u1ea3 c\u00e1c ul$(\"ul\").find('.item').addClass('selected');<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-cach-tim-t\u1ea5t-c\u1ea3-ph\u1ea7n-t\u1eed-con-v\u1edbi-class-c\u1ee5-th\u1ec3-b\u1eb1ng-jquery\"><strong>C\u00e1ch t\u00ecm t\u1ea5t c\u1ea3 ph\u1ea7n t\u1eed con v\u1edbi class c\u1ee5 th\u1ec3 b\u1eb1ng jQuery<\/strong><\/h3>\n\n\n\n<p>Gi\u1ea3 s\u1eed b\u1ea1n c\u00f3 m\u1ed9t t\u00e0i li\u1ec7u HTML v\u00e0 c\u1ea7n l\u1ea5y th\u00f4ng tin v\u1ec1 ph\u1ea7n t\u1eed cha d\u1ef1a tr\u00ean class \u0111\u00e3 bi\u1ebft c\u1ee7a ph\u1ea7n t\u1eed con. Trong tr\u01b0\u1eddng h\u1ee3p n\u00e0y, ch\u00fang ta s\u1eed d\u1ee5ng ph\u01b0\u01a1ng th\u1ee9c <code>closest()<\/code> thay v\u00ec <code>find()<\/code>.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-cach-ti\u1ebfp-c\u1eadn-1\"><strong>C\u00e1ch ti\u1ebfp c\u1eadn 1<\/strong><\/h4>\n\n\n\n<p>Ph\u01b0\u01a1ng th\u1ee9c <code>on()<\/code> \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 g\u1eafn s\u1ef1 ki\u1ec7n cho c\u00e1c ph\u1ea7n t\u1eed \u0111\u00e3 ch\u1ecdn. T\u1ee9c l\u00e0, khi ng\u01b0\u1eddi d\u00f9ng click v\u00e0o n\u00fat, h\u00e0m x\u1eed l\u00fd s\u1ebd \u0111\u01b0\u1ee3c g\u1ecdi.<\/p>\n\n\n\n<p>Ph\u01b0\u01a1ng th\u1ee9c <code>closest()<\/code> \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 t\u00ecm v\u00e0 tr\u1ea3 v\u1ec1 ph\u1ea7n t\u1eed ancestors (cha) g\u1ea7n nh\u1ea5t c\u1ee7a ph\u1ea7n t\u1eed \u0111ang \u0111\u01b0\u1ee3c ch\u1ecdn thay v\u00ec t\u00ecm ph\u1ea7n t\u1eed con nh\u01b0 <code>find()<\/code>. N\u1ebfu ph\u1ea7n t\u1eed t\u1ed5 ti\u00ean \u0111\u00f3 t\u1ed3n t\u1ea1i th\u00ec s\u1ebd tr\u1ea3 v\u1ec1 jQuery object, ng\u01b0\u1ee3c l\u1ea1i s\u1ebd tr\u1ea3 v\u1ec1 object r\u1ed7ng<\/p>\n\n\n\n<p>V\u00ed d\u1ee5 n\u00e0y s\u1eed d\u1ee5ng ph\u01b0\u01a1ng th\u1ee9c <code>closest()<\/code> \u0111\u1ec3 l\u1ea5y ph\u1ea7n t\u1eed ancestors kh\u1edbp \u0111\u1ea7u ti\u00ean c\u1ee7a ph\u1ea7n t\u1eed.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html>\n&lt;head>\n\u00a0\u00a0\u00a0\u00a0&lt;title>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0How to find a parent class\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0name with a known class\n\u00a0\u00a0\u00a0\u00a0&lt;\/title>\n\u00a0\u00a0\u00a0\u00a0&lt;script src=\n\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.4.0\/jquery.min.js\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/head>\n\n&lt;body style=\"text-align:center;\">\n\u00a0\u00a0\u00a0\u00a0&lt;h1 style=\"color:red;\">\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0ITviec\n\u00a0\u00a0\u00a0\u00a0&lt;\/h1>\n\u00a0\u00a0\u00a0\u00a0&lt;p id=\"GFG_UP\" style=\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"font-size: 17px; font-weight: bold;\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/p>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"parent\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;div class=\"child\">&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;button>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0click here\n\u00a0\u00a0\u00a0\u00a0&lt;\/button>\n\u00a0\u00a0\u00a0\u00a0&lt;p id=\"GFG_DOWN\" style=\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"color: red; font-size: 24px; font-weight: bold;\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/p>\n\u00a0\u00a0\u00a0\u00a0&lt;script>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('#GFG_UP').text('Click on the button to see result');\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('button').on('click', function() {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0var object = $('.child').closest('.parent');\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (object.length) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('#GFG_DOWN').text(\"className = '.child'\"\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0+ \" with parentName = '.parent'\" + \" Exists\");\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('#GFG_DOWN').text(\"Not Exists\");\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/body>\n&lt;\/html><\/code><\/pre>\n\n\n\n<p>K\u1ebft qu\u1ea3 c\u1ee7a \u0111o\u1ea1n m\u00e3 tr\u00ean:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"174\" src=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-1-vippro-640x174.jpg\" alt=\"find jquery - itviec blog\" class=\"wp-image-88647\" style=\"width:720px;height:auto\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-1-vippro-640x174.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-1-vippro-300x81.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-1-vippro-200x54.jpg 200w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-1-vippro.jpg 766w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<p>K\u1ebft qu\u1ea3 sau khi nh\u1ea5n v\u00e0o n\u00fat button:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"192\" src=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-2-vippro-640x192.jpg\" alt=\"\" class=\"wp-image-88648\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-2-vippro-640x192.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-2-vippro-300x90.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-2-vippro-200x60.jpg 200w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-2-vippro-768x230.jpg 768w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-2-vippro.jpg 864w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-cach-ti\u1ebfp-c\u1eadn-2\"><strong>C\u00e1ch ti\u1ebfp c\u1eadn 2<\/strong><\/h4>\n\n\n\n<p>Ho\u1eb7c b\u1ea1n c\u00f3 th\u1ec3 th\u1ef1c hi\u1ec7n theo c\u00e1ch s\u1ed1 2 nh\u01b0 sau:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Ph\u01b0\u01a1ng th\u1ee9c <code>on()<\/code> \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 g\u1eafn h\u00e0m x\u1eed l\u00fd s\u1ef1 ki\u1ec7n cho c\u00e1c ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn. T\u1ee9c l\u00e0, khi ng\u01b0\u1eddi d\u00f9ng click v\u00e0o n\u00fat, h\u00e0m s\u1ebd \u0111\u01b0\u1ee3c g\u1ecdi.<\/li>\n\n\n\n<li>Ph\u01b0\u01a1ng th\u1ee9c <code>parent()<\/code> \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 tr\u1ea3 v\u1ec1 ph\u1ea7n t\u1eed cha tr\u1ef1c ti\u1ebfp c\u1ee7a ph\u1ea7n t\u1eed \u0111ang \u0111\u01b0\u1ee3c ch\u1ecdn.<\/li>\n\n\n\n<li>N\u1ebfu ph\u1ea7n t\u1eed cha \u0111\u00f3 c\u00f3 class th\u00ec s\u1ebd tr\u1ea3 v\u1ec1 t\u00ean class, ng\u01b0\u1ee3c l\u1ea1i s\u1ebd tr\u1ea3 v\u1ec1 th\u00f4ng b\u00e1o l\u00e0 kh\u00f4ng t\u1ed3n t\u1ea1i.<\/li>\n<\/ul>\n\n\n\n<p>D\u01b0\u1edbi \u0111\u00e2y l\u00e0 v\u00ed d\u1ee5 v\u1ec1 t\u00ecm class c\u1ee7a ph\u1ea7n t\u1eed cha (parent) d\u1ef1a tr\u00ean class c\u1ee7a ph\u1ea7n t\u1eed con (<code>.child<\/code>). Khi ng\u01b0\u1eddi d\u00f9ng click v\u00e0o n\u00fat, ch\u01b0\u01a1ng tr\u00ecnh s\u1ebd ki\u1ec3m tra xem ph\u1ea7n t\u1eed con <code>.child<\/code> c\u00f3 n\u1eb1m b\u00ean trong ph\u1ea7n t\u1eed cha .parent hay kh\u00f4ng, r\u1ed3i hi\u1ec3n th\u1ecb k\u1ebft qu\u1ea3.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html>\n&lt;head>\n\u00a0\u00a0\u00a0\u00a0&lt;title>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0How to find a parent class\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0name with a known class\n\u00a0\u00a0\u00a0\u00a0&lt;\/title>\n\u00a0\u00a0\u00a0\u00a0&lt;script src=\n\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.4.0\/jquery.min.js\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/head>\n&lt;body style=\"text-align:center;\">\n\u00a0\u00a0\u00a0\u00a0&lt;h1 style=\"color:red;\">\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0ITviec\u00a0\n\u00a0\u00a0\u00a0\u00a0&lt;\/h1>\n\u00a0\u00a0\u00a0\u00a0&lt;p id=\"GFG_UP\" style=\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"font-size: 17px; font-weight: bold;\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/p>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"parent\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;div class=\"child\">&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;button>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0click here\n\u00a0\u00a0\u00a0\u00a0&lt;\/button>\n\u00a0\u00a0\u00a0\u00a0&lt;p id=\"GFG_DOWN\" style=\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"color: red; font-size: 24px; font-weight: bold;\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/p>\n\u00a0\u00a0\u00a0\u00a0&lt;script>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('#GFG_UP').text('Click on the button to see result');\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('button').on('click', function() {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0var object = $('.child').parents('.parent');\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (object.length) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('#GFG_DOWN').text(\"className = '.child'\"\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0+ \" with parentName = '.parent'\" + \" Exists\");\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0else {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$('#GFG_DOWN').text(\"Not Exists\");\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/body>\n&lt;\/html><\/code><\/pre>\n\n\n\n<p>K\u1ebft qu\u1ea3 hi\u1ec3n th\u1ecb c\u1ee7a \u0111o\u1ea1n m\u00e3 tr\u00ean:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"156\" src=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-3-vippro-640x156.jpg\" alt=\"find jquery - itviec blog\" class=\"wp-image-88649\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-3-vippro-640x156.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-3-vippro-300x73.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-3-vippro-200x49.jpg 200w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-3-vippro-768x187.jpg 768w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-3-vippro.jpg 790w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<p>K\u1ebft qu\u1ea3 hi\u1ec3n th\u1ecb khi nh\u1ea5n v\u00e0o n\u00fat button:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"195\" src=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-4-vippro-640x195.jpg\" alt=\"find jquery - itviec blog\" class=\"wp-image-88650\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-4-vippro-640x195.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-4-vippro-300x91.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-4-vippro-200x61.jpg 200w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-4-vippro-768x234.jpg 768w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-4-vippro.jpg 841w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<p>Gi\u1ea3i th\u00edch v\u00ed d\u1ee5 tr\u00ean:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong><code>$('#GFG_UP').text('Click on the button to see result')<\/code>:<\/strong> Th\u00eam d\u00f2ng h\u01b0\u1edbng d\u1eabn v\u00e0o th\u1ebb <code>&lt;p id=\"GFG_UP\"><\/code><\/li>\n\n\n\n<li><strong><code>$('button').on('click', function() {<\/code>:<\/strong> Chu\u1ed7i g\u1eafn s\u1ef1 ki\u1ec7n click cho n\u00fat. Khi ng\u01b0\u1eddi d\u00f9ng click, \u0111o\u1ea1n m\u00e3 b\u00ean trong s\u1ebd ch\u1ea1y<\/li>\n\n\n\n<li><strong><code>.child<\/code>: <\/strong>Ph\u1ea7n t\u1eed con \u0111\u00e3 bi\u1ebft class<\/li>\n\n\n\n<li><strong><code>.parents('.parent')<\/code>: <\/strong>Ph\u01b0\u01a1ng th\u1ee9c t\u00ecm t\u1ea5t c\u1ea3 ancestors (t\u1ed5 ti\u00ean) c\u1ee7a .child, sau \u0111\u00f3 l\u1ecdc ra ph\u1ea7n t\u1eed c\u00f3 class l\u00e0 .parent<\/li>\n<\/ul>\n\n\n\n<p>Khi b\u1ea1n nh\u1ea5n n\u00fat jQuery s\u1ebd ki\u1ec3m tra xem .child c\u00f3 n\u1eb1m trong .parent kh\u00f4ng. N\u1ebfu c\u00f3 th\u00ec th\u00f4ng b\u00e1o m\u1ed1i quan h\u1ec7 cha-con t\u1ed3n t\u1ea1i. N\u1ebfu kh\u00f4ng s\u1ebd hi\u1ec3n th\u1ecb th\u00f4ng b\u00e1o &#8220;Not Exists&#8221;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-cach-tim-class-c\u1ee7a-ph\u1ea7n-t\u1eed-v\u1eeba-d\u01b0\u1ee3c-click-b\u1eb1ng-jquery\"><strong>C\u00e1ch t\u00ecm class c\u1ee7a ph\u1ea7n t\u1eed v\u1eeba \u0111\u01b0\u1ee3c click b\u1eb1ng jQuery<\/strong><\/h3>\n\n\n\n<p>\u0110\u1ec3 l\u1ea5y class c\u1ee7a ph\u1ea7n t\u1eed khi click, b\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng thu\u1ed9c t\u00ednh <code>this.className<\/code>. Thu\u1ed9c t\u00ednh className \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 l\u1ea5y ho\u1eb7c g\u00e1n gi\u00e1 tr\u1ecb cho thu\u1ed9c t\u00ednh class c\u1ee7a m\u1ed9t ph\u1ea7n t\u1eed HTML. B\u1eb1ng c\u00e1ch n\u00e0y, ng\u01b0\u1eddi d\u00f9ng c\u00f3 th\u1ec3 thay \u0111\u1ed5i ho\u1eb7c truy xu\u1ea5t class hi\u1ec7n t\u1ea1i c\u1ee7a ph\u1ea7n t\u1eed theo \u00fd mu\u1ed1n.<\/p>\n\n\n\n<p>\u1ede \u0111\u00e2y, b\u1ea1n s\u1eed d\u1ee5ng <code>this.className<\/code> \u0111\u1ec3 l\u1ea5y t\u00ean class c\u1ee7a ph\u1ea7n t\u1eed div \u0111ang \u0111\u01b0\u1ee3c click. Ch\u1eb3ng h\u1ea1n nh\u01b0 trong v\u00ed d\u1ee5 d\u01b0\u1edbi \u0111\u00e2y, c\u00f3 5 th\u1ebb div v\u1edbi c\u00e1c class kh\u00e1c nhau. Khi ng\u01b0\u1eddi d\u00f9ng click v\u00e0o m\u1ed9t div, jQuery s\u1ebd d\u00f9ng thu\u1ed9c t\u00ednh <code>this.className<\/code> \u0111\u1ec3 l\u1ea5y t\u00ean class c\u1ee7a ph\u1ea7n t\u1eed \u0111\u00f3 v\u00e0 hi\u1ec3n th\u1ecb ra console.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$(\"div\").click(function () {\n\u00a0\u00a0\u00a0\u00a0var getClass = this.className;\n\u00a0\u00a0\u00a0\u00a0console.log(getClass);\n});<\/code><\/pre>\n\n\n\n<p>Khi click v\u00e0o b\u1ea5t k\u1ef3 th\u1ebb div n\u00e0o, \u0111o\u1ea1n m\u00e3 s\u1ebd in ra t\u00ean class c\u1ee7a ph\u1ea7n t\u1eed \u0111\u00f3 trong b\u1ea3ng \u0111i\u1ec1u khi\u1ec3n (console).<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;html lang=\"en\">\n&lt;head>\n\u00a0\u00a0\u00a0\u00a0&lt;title>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0How to find the class of the\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0clicked element using jquery?\n\u00a0\u00a0\u00a0\u00a0&lt;\/title>\n\u00a0\u00a0\u00a0\u00a0&lt;!-- Import jQuery cdn library -->\n\u00a0\u00a0\u00a0\u00a0&lt;script src=\n\"https:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/3.3.1\/jquery.min.js\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n\u00a0\u00a0\u00a0\u00a0&lt;script>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$(document).ready(function () {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$(\"div\").click(function () {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0var getClass = this.className;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0console.log(getClass);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0});\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/head>\n&lt;body style=\"text-align: center;\">\n\u00a0\u00a0\u00a0\u00a0&lt;h1 style=\"color: red;\">\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0ITviec\n\u00a0\u00a0\u00a0\u00a0&lt;\/h1>\n\u00a0\u00a0\u00a0\u00a0&lt;h3>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0How to find the class of the\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0clicked element using jquery?\n\u00a0\u00a0\u00a0\u00a0&lt;\/h3>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"main\">Main Div&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"ITviec\">ITviec&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"ITviec Blog\">ITviec Blog&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"ITviec Career\">ITviec Career&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=\"welcome\">Welcome&lt;\/div>\n&lt;\/body>\n&lt;\/html><\/code><\/pre>\n\n\n\n<p>K\u1ebft qu\u1ea3 hi\u1ec3n th\u1ecb c\u1ee7a \u0111o\u1ea1n m\u00e3 tr\u00ean:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"222\" src=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-5-vippro-640x222.jpg\" alt=\"\" class=\"wp-image-88651\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-5-vippro-640x222.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-5-vippro-300x104.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-5-vippro-200x69.jpg 200w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-5-vippro-768x267.jpg 768w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-5-vippro.jpg 838w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<p>Gi\u1ea3i th\u00edch v\u00ed d\u1ee5 tr\u00ean:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>5 ph\u1ea7n t\u1eed <code>&lt;div><\/code>, m\u1ed7i c\u00e1i c\u00f3 m\u1ed9t ho\u1eb7c nhi\u1ec1u class.<\/li>\n\n\n\n<li><strong><code>$(document).ready(...)<\/code>:<\/strong> \u0110\u1ea3m b\u1ea3o m\u00e3 jQuery ch\u1ec9 ch\u1ea1y khi t\u00e0i li\u1ec7u HTML \u0111\u00e3 t\u1ea3i xong.<\/li>\n\n\n\n<li><strong><code>$(\"div\").click(...)<\/code>: <\/strong>G\u1eafn s\u1ef1 ki\u1ec7n click cho t\u1ea5t c\u1ea3 c\u00e1c th\u1ebb &lt;div>.<\/li>\n\n\n\n<li><strong><code>this.className<\/code>:<\/strong> D\u00f9ng \u0111\u1ec3 l\u1ea5y t\u00ean class c\u1ee7a ph\u1ea7n t\u1eed v\u1eeba \u0111\u01b0\u1ee3c click.<\/li>\n\n\n\n<li><strong><code>console.log(getClass)<\/code>:<\/strong> In t\u00ean class c\u1ee7a ph\u1ea7n t\u1eed \u0111\u00f3 ra b\u1ea3ng \u0111i\u1ec1u khi\u1ec3n (console).<\/li>\n<\/ul>\n\n\n\n<p>\u0110\u00e2y l\u00e0 v\u00ed d\u1ee5 \u0111\u01a1n gi\u1ea3n, tr\u1ef1c quan \u0111\u1ec3 hi\u1ec3u c\u00e1ch l\u1ea5y class c\u1ee7a ph\u1ea7n t\u1eed ng\u01b0\u1eddi d\u00f9ng click. Ph\u00f9 h\u1ee3p khi b\u1ea1n c\u1ea7n x\u00e1c \u0111\u1ecbnh ph\u1ea7n t\u1eed n\u00e0o \u0111ang \u0111\u01b0\u1ee3c thao t\u00e1c, \u0111\u1ec3 x\u1eed l\u00fd ti\u1ebfp (\u1ea9n, \u0111\u1ed5i m\u00e0u, th\u00eam hi\u1ec7u \u1ee9ng&#8230;).<\/p>\n\n\n\n<p>N\u1ebfu mu\u1ed1n ki\u1ec3m tra ri\u00eang l\u1ebb t\u1eebng class (trong tr\u01b0\u1eddng h\u1ee3p c\u00f3 nhi\u1ec1u class), b\u1ea1n c\u00f3 th\u1ec3 d\u00f9ng <code>$(this).hasClass('class-name')<\/code> ho\u1eb7c t\u00e1ch chu\u1ed7i b\u1eb1ng <code>.split(\" \")<\/code>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-so-sanh-find-v\u1edbi-cac-ph\u01b0\u01a1ng-th\u1ee9c-khac-trong-jquery\"><span class=\"ez-toc-section\" id=\"So_sanh_find_voi_cac_phuong_thuc_khac_trong_jQuery\"><\/span><strong>So s\u00e1nh find() v\u1edbi c\u00e1c ph\u01b0\u01a1ng th\u1ee9c kh\u00e1c trong jQuery<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><code>find()<\/code> l\u00e0 m\u1ed9t trong nh\u1eefng h\u00e0m ph\u1ed5 bi\u1ebfn nh\u1ea5t \u0111\u1ec3 t\u00ecm ki\u1ebfm ph\u1ea7n t\u1eed con n\u1eb1m s\u00e2u b\u00ean trong c\u1ea5u tr\u00fac HTML. Tuy nhi\u00ean, ngo\u00e0i <code>find()<\/code>, jQuery c\u00f2n cung c\u1ea5p m\u1ed9t s\u1ed1 ph\u01b0\u01a1ng th\u1ee9c kh\u00e1c nh\u01b0 <code>children()<\/code>, <code>closest()<\/code> v\u00e0 <code>filter()<\/code>. M\u1ed7i ph\u01b0\u01a1ng th\u1ee9c \u0111\u1ec1u c\u00f3 \u0111i\u1ec3m m\u1ea1nh v\u00e0 tr\u01b0\u1eddng h\u1ee3p s\u1eed d\u1ee5ng ri\u00eang. Sau \u0111\u00e2y c\u00f9ng t\u00ecm hi\u1ec3u v\u1ec1 s\u1ef1 kh\u00e1c nhau gi\u1eefa <code>find()<\/code> v\u00e0 c\u00e1c ph\u01b0\u01a1ng th\u1ee9c tr\u00ean.\u00a0<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-so-sanh-find-va-children\"><strong>So s\u00e1nh find() v\u00e0 children()<\/strong><\/h3>\n\n\n\n<p>B\u1ea1n c\u00f3 th\u1ec3 hi\u1ec3u c\u01a1 b\u1ea3n v\u1ec1 2 ph\u01b0\u01a1ng th\u1ee9c n\u00e0y nh\u01b0 sau:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong><code>find()<\/code>: <\/strong>\u0110\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 l\u1ea5y t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con \u0111\u00e3 l\u1ecdc c\u1ee7a m\u1ed7i ph\u1ea7n t\u1eed trong t\u1eadp h\u1ee3p c\u00e1c ph\u1ea7n t\u1eed ph\u00f9 h\u1ee3p hi\u1ec7n t\u1ea1i.<\/li>\n\n\n\n<li><strong><code>children()<\/code>:<\/strong> C\u0169ng \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 l\u1ea5y t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con c\u1ee7a t\u1eebng ph\u1ea7n t\u1eed trong t\u1eadp h\u1ee3p \u0111\u00e3 ch\u1ecdn. B\u1ea1n c\u0169ng c\u00f3 th\u1ec3 l\u1ecdc k\u1ebft qu\u1ea3 tr\u1ea3 v\u1ec1 n\u1ebfu mu\u1ed1n. N\u1ebfu kh\u00f4ng truy\u1ec1n v\u00e0o b\u1ea5t k\u1ef3 bi\u1ec3u th\u1ee9c l\u1ecdc n\u00e0o, <code>children()<\/code> s\u1ebd tr\u1ea3 v\u1ec1 t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con tr\u1ef1c ti\u1ebfp c\u1ee7a ph\u1ea7n t\u1eed \u0111\u00e3 ch\u1ecdn. N\u1ebfu mu\u1ed1n l\u1ecdc, ch\u1ec9 c\u1ea7n truy\u1ec1n v\u00e0o t\u00ean ph\u1ea7n t\u1eed ho\u1eb7c class c\u1ea7n t\u00ecm. Gi\u00e1 tr\u1ecb tr\u1ea3 v\u1ec1 c\u1ee7a <code>children()<\/code> s\u1ebd ch\u1ec9 tr\u1ea3 v\u1ec1 c\u00e1c ph\u1ea7n t\u1eed con tr\u1ef1c ti\u1ebfp (m\u1ed9t c\u1ea5p) c\u1ee7a ph\u1ea7n t\u1eed \u0111\u00e3 ch\u1ecdn.<\/li>\n<\/ul>\n\n\n\n<p><strong>T\u00f3m l\u1ea1i:<\/strong> C\u1ea3 hai ph\u01b0\u01a1ng th\u1ee9c <code>find()<\/code> v\u00e0 <code>children()<\/code> \u0111\u1ec1u d\u00f9ng \u0111\u1ec3 t\u00ecm ki\u1ebfm ph\u1ea7n t\u1eed con, nh\u01b0ng c\u00e1ch ho\u1ea1t \u0111\u1ed9ng c\u1ee7a ch\u00fang c\u00f3 m\u1ed9t \u0111i\u1ec3m kh\u00e1c bi\u1ec7t quan tr\u1ecdng. C\u00f9ng t\u00ecm hi\u1ec3u qua v\u00ed d\u1ee5 d\u01b0\u1edbi \u0111\u00e2y:<\/p>\n\n\n\n<p>Gi\u1ea3 s\u1eed b\u1ea1n c\u00f3 m\u1ed9t c\u1ea5u tr\u00fac <a href=\"https:\/\/itviec.com\/blog\/html-la-gi\/\" target=\"_blank\" rel=\"noreferrer noopener\">HTML<\/a> g\u1ed3m 3 class l\u00e0 <code>a<\/code>, <code>b<\/code>, v\u00e0 <code>c<\/code>, m\u1ed7i class \u0111\u1ec1u ch\u1ee9a hai th\u1ebb <code>&lt;p><\/code> n\u1eb1m \u1edf c\u00e1c c\u1ea5p kh\u00e1c nhau trong DOM.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;head>\n\u00a0\u00a0\u00a0\u00a0&lt;!-- jQuery library -->\n\u00a0\u00a0\u00a0\u00a0&lt;script src=\n\"http:\/\/ajax.googleapis.com\/ajax\/libs\/jquery\/1.4.2\/jquery.min.js\"\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0type=\"text\/javascript\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/head>\n&lt;body>\n\u00a0\u00a0\u00a0\u00a0&lt;div class=a>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p id=\"a1\"> a1 &lt;\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p id=\"a1\"> a2 &lt;\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;div class=b>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p id=\"a2\"> b1 &lt;\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p id=\"a2\"> b1 &lt;\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;div class=c>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p id=\"a3\"> c1 &lt;\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;p id=\"a3\"> c2 &lt;\/p>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;\/div>\n\u00a0\u00a0\u00a0\u00a0&lt;script>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$(\".a\").find(\"p\").css('color','red')\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$(\".a\").children(\"p\").css('color','blue')\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/body>\n&lt;\/html><\/code><\/pre>\n\n\n\n<p>K\u1ebft qu\u1ea3 hi\u1ec3n th\u1ecb c\u1ee7a \u0111o\u1ea1n m\u00e3 tr\u00ean:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"196\" src=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-6-vippro-640x196.jpg\" alt=\"find jquery - itviec blog\" class=\"wp-image-88652\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-6-vippro-640x196.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-6-vippro-300x92.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-6-vippro-200x61.jpg 200w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-6-vippro-768x235.jpg 768w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-6-vippro.jpg 982w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Khi b\u1ea1n g\u1ecdi ph\u01b0\u01a1ng th\u1ee9c <code>find()<\/code> tr\u00ean class a<\/strong>, jQuery s\u1ebd \u0111i s\u00e2u xu\u1ed1ng to\u00e0n b\u1ed9 c\u00e1c c\u1ea5p con, t\u00ecm ki\u1ebfm th\u1ebb <code>&lt;p><\/code> \u1edf m\u1ecdi n\u01a1i b\u00ean trong, k\u1ec3 c\u1ea3 ch\u00e1u, ch\u1eaft,\u2026 c\u1ee7a ph\u1ea7n t\u1eed \u0111\u00f3. N\u00f3 s\u1ebd ki\u1ec3m tra t\u1ea5t c\u1ea3 c\u00e1c t\u1ea7ng con b\u00ean trong cho \u0111\u1ebfn khi t\u00ecm h\u1ebft.<\/li>\n\n\n\n<li><strong>Ng\u01b0\u1ee3c l\u1ea1i, khi b\u1ea1n g\u1ecdi <code>children()<\/code><\/strong> <strong>tr\u00ean class a<\/strong>, jQuery ch\u1ec9 ki\u1ec3m tra c\u00e1c ph\u1ea7n t\u1eed con tr\u1ef1c ti\u1ebfp c\u1ee7a n\u00f3, ngh\u0129a l\u00e0 ch\u1ec9 ki\u1ec3m tra \u1edf m\u1ed9t c\u1ea5p \u0111\u1ea7u ti\u00ean, kh\u00f4ng \u0111i chi ti\u1ebft v\u00e0o c\u00e1c c\u1ea5p b\u00ean trong.<\/li>\n<\/ul>\n\n\n\n<p>N\u00f3i c\u00e1ch kh\u00e1c, <code>find()<\/code> gi\u1ed1ng nh\u01b0 vi\u1ec7c \u201cl\u1ee5c tung c\u1ea3 ng\u00f4i nh\u00e0\u201d, c\u00f2n <code>children()<\/code> th\u00ec ch\u1ec9 \u201cli\u1ebfc nh\u00ecn c\u00e1c ph\u00f2ng ngay t\u1ea7ng tr\u1ec7t\u201d m\u00e0 th\u00f4i.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-b\u1ea3ng-tom-t\u1eaft-s\u1ef1-khac-nhau-gi\u1eefa-find-vs-children\"><strong>B\u1ea3ng t\u00f3m t\u1eaft s\u1ef1 kh\u00e1c nhau gi\u1eefa find() vs children()<\/strong><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><strong>Ti\u00eau ch\u00ed<\/strong><\/td><td><strong>find()<\/strong><\/td><td><strong>children()<\/strong><\/td><\/tr><tr><td>M\u1ee5c \u0111\u00edch<\/td><td>D\u00f9ng \u0111\u1ec3 t\u00ecm ki\u1ebfm nhi\u1ec1u c\u1ea5p con trong DOM.<\/td><td>D\u00f9ng \u0111\u1ec3 t\u00ecm ki\u1ebfm m\u1ed9t c\u1ea5p con duy nh\u1ea5t trong DOM.<\/td><\/tr><tr><td>Hi\u1ec7u su\u1ea5t<\/td><td>Ch\u1eadm h\u01a1n so v\u1edbi children() v\u00ec ph\u1ea3i \u0111i qua nhi\u1ec1u c\u1ea5p.<\/td><td>Nhanh h\u01a1n v\u00ec ch\u1ec9 ki\u1ec3m tra c\u1ea5p con tr\u1ef1c ti\u1ebfp.<\/td><\/tr><tr><td>C\u00fa ph\u00e1p<\/td><td><code>$(selector).find(filter)<\/code><\/td><td><code>$(selector).children(filter)<\/code><\/td><\/tr><tr><td>Tham s\u1ed1<\/td><td>Nh\u1eadn v\u00e0o m\u1ed9t bi\u1ec3u th\u1ee9c l\u1ecdc (filter expression) l\u00e0m tham s\u1ed1.<\/td><td>C\u0169ng nh\u1eadn m\u1ed9t bi\u1ec3u th\u1ee9c l\u1ecdc, nh\u01b0ng ch\u1ec9 \u00e1p d\u1ee5ng cho c\u00e1c ph\u1ea7n t\u1eed con tr\u1ef1c ti\u1ebfp.<\/td><\/tr><tr><td>K\u1ebft qu\u1ea3<\/td><td>Tr\u1ea3 v\u1ec1 t\u1ea5t c\u1ea3 ph\u1ea7n t\u1eed con (descendants) c\u1ee7a ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn.<\/td><td>Tr\u1ea3 v\u1ec1 c\u00e1c ph\u1ea7n t\u1eed con tr\u1ef1c ti\u1ebfp c\u1ee7a ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-so-sanh-find-va-closest\">So s\u00e1nh <strong>find() v\u00e0 closest()<\/strong><\/h3>\n\n\n\n<p><code>closest()<\/code> l\u00e0 ph\u01b0\u01a1ng th\u1ee9c \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 t\u00ecm ph\u1ea7n t\u1eed t\u1ed5 ti\u00ean (ancestor) g\u1ea7n nh\u1ea5t c\u1ee7a ph\u1ea7n t\u1eed \u0111ang \u0111\u01b0\u1ee3c ch\u1ecdn. Ph\u1ea7n t\u1eed ancestor c\u00f3 th\u1ec3 l\u00e0 parents, grand-parent, great-grandparents,&#8230;\u00a0<\/p>\n\n\n\n<p><strong>C\u00fa ph\u00e1p c\u1ee7a closest():<\/strong><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$(selector).closest(filter-expression)<\/code><\/pre>\n\n\n\n<p><strong>Tham s\u1ed1:<\/strong> L\u00e0 m\u1ed9t bi\u1ec3u th\u1ee9c ch\u1ecdn (selector), m\u1ed9t ph\u1ea7n t\u1eed, ho\u1eb7c m\u1ed9t \u0111\u1ed1i t\u01b0\u1ee3ng jQuery d\u00f9ng \u0111\u1ec3 l\u1ecdc v\u00e0 t\u00ecm ph\u1ea7n t\u1eed ancestor.<\/p>\n\n\n\n<p>Ph\u01b0\u01a1ng th\u1ee9c n\u00e0y s\u1ebd di chuy\u1ec3n ng\u01b0\u1ee3c l\u00ean tr\u00ean DOM, b\u1eaft \u0111\u1ea7u t\u1eeb ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn, \u0111i d\u1ea7n l\u00ean \u0111\u1ebfn t\u1eadn ph\u1ea7n t\u1eed g\u1ed1c (&lt;html&gt;) \u0111\u1ec3 t\u00ecm ancestor kh\u1edbp v\u1edbi \u0111i\u1ec1u ki\u1ec7n.<\/p>\n\n\n\n<p><strong>V\u00ed d\u1ee5:<\/strong><\/p>\n\n\n\n<p>Gi\u1ea3 s\u1eed b\u1ea1n c\u00f3 3 c\u1ea5p th\u1ebb danh s\u00e1ch kh\u00f4ng th\u1ee9 t\u1ef1 <code>&lt;ul><\/code>. Khi g\u1ecdi ph\u01b0\u01a1ng th\u1ee9c <code>closest()<\/code> tr\u00ean m\u1ed9t th\u1ebb <code>&lt;li><\/code>, n\u00f3 s\u1ebd tr\u1ea3 v\u1ec1 th\u1ebb &lt;ul> g\u1ea7n nh\u1ea5t bao quanh <code>&lt;li><\/code> \u0111\u00f3.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html>\n&lt;head>\n\u00a0\u00a0\u00a0\u00a0&lt;!-- jQuery library -->\n\u00a0\u00a0\u00a0\u00a0&lt;script src=\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\"https:\/\/code.jquery.com\/jquery-git.js\">\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/head>\n\n&lt;body>\n\u00a0\u00a0\u00a0\u00a0&lt;ul>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;li>one&lt;\/li>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;li>two&lt;\/li>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;ul>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;li>three&lt;\/li>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;li>four&lt;\/li>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;ul>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;li id=\"select-Me\">five&lt;\/li>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;li>six&lt;\/li>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/ul>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;\/ul>\n\u00a0\u00a0\u00a0\u00a0&lt;\/ul>\n\u00a0\u00a0\u00a0\u00a0&lt;script>\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$(\"#select-Me\")\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.closest(\"ul\")\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0.css(\"color\", \"blue\");\n\u00a0\u00a0\u00a0\u00a0&lt;\/script>\n&lt;\/body>\n&lt;\/html><\/code><\/pre>\n\n\n\n<p>K\u1ebft qu\u1ea3 hi\u1ec3n th\u1ecb c\u1ee7a \u0111o\u1ea1n m\u00e3 tr\u00ean:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"387\" height=\"220\" src=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-7-vippro.jpg\" alt=\"find jquery - itviec blog\" class=\"wp-image-88653\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-7-vippro.jpg 387w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-7-vippro-300x171.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-7-vippro-200x114.jpg 200w\" sizes=\"auto, (max-width: 387px) 100vw, 387px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-b\u1ea3ng-so-sanh-v\u1ec1-s\u1ef1-khac-bi\u1ec7t-gi\u1eefa-find-va-closest\"><strong>B\u1ea3ng so s\u00e1nh v\u1ec1 s\u1ef1 kh\u00e1c bi\u1ec7t gi\u1eefa find() v\u00e0 closest()<\/strong><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><strong>Ti\u00eau ch\u00ed<\/strong><\/td><td><strong>find()<\/strong><\/td><td><strong>closest()<\/strong><\/td><\/tr><tr><td>M\u1ee5c \u0111\u00edch<\/td><td>D\u00f9ng \u0111\u1ec3 l\u1ea5y t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con (descendants) th\u1ecfa \u0111i\u1ec1u ki\u1ec7n trong t\u1eadp h\u1ee3p ph\u1ea7n t\u1eed \u0111ang ch\u1ecdn.<\/td><td>D\u00f9ng \u0111\u1ec3 l\u1ea5y ph\u1ea7n t\u1eed ancestor g\u1ea7n nh\u1ea5t c\u1ee7a ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn.<\/td><\/tr><tr><td>H\u01b0\u1edbng duy\u1ec7t DOM<\/td><td>Duy\u1ec7t DOM t\u1eeb tr\u00ean xu\u1ed1ng, cho \u0111\u1ebfn ph\u1ea7n t\u1eed con cu\u1ed1i c\u00f9ng.<\/td><td>Duy\u1ec7t DOM t\u1eeb d\u01b0\u1edbi l\u00ean tr\u00ean, cho \u0111\u1ebfn \u0111\u1ebfn t\u1eadn ph\u1ea7n t\u1eed g\u1ed1c (&lt;html&gt;).<\/td><\/tr><tr><td>Ph\u1ea1m vi t\u00ecm ki\u1ebfm<\/td><td>\u0110i xu\u1ed1ng c\u00e2y DOM, ki\u1ec3m tra ph\u1ea7n t\u1eed con, r\u1ed3i con c\u1ee7a con, v\u00e0 ti\u1ebfp t\u1ee5c.<\/td><td>\u0110i l\u00ean c\u00e2y DOM, ki\u1ec3m tra c\u00e1c ph\u1ea7n t\u1eed cha.<\/td><\/tr><tr><td>C\u00fa ph\u00e1p<\/td><td><code>$(selector).find(filter)<\/code><\/td><td><code>$(selector).closest(filter)<\/code><\/td><\/tr><tr><td>Tham s\u1ed1<\/td><td>L\u1ea5y tham s\u1ed1 l\u00e0 filter expression<\/td><td>Tham s\u1ed1 l\u00e0 filter<\/td><\/tr><tr><td>K\u1ebft qu\u1ea3<\/td><td>Tr\u1ea3 v\u1ec1 c\u00e1c ph\u1ea7n t\u1eed con (descendant elements) c\u1ee7a ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn.<\/td><td>Tr\u1ea3 v\u1ec1 ph\u1ea7n t\u1eed ancestor g\u1ea7n nh\u1ea5t c\u1ee7a ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-so-sanh-find-va-filter\"><strong>So s\u00e1nh find() v\u00e0 filter()<\/strong><\/h3>\n\n\n\n<p>Ph\u01b0\u01a1ng th\u1ee9c <code>filter()<\/code> \u0111\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 l\u1ecdc c\u00e1c ph\u1ea7n t\u1eed, ch\u1ec9 gi\u1eef l\u1ea1i nh\u1eefng ph\u1ea7n t\u1eed ph\u00f9 h\u1ee3p v\u1edbi \u0111i\u1ec1u ki\u1ec7n, nh\u1eefng ph\u1ea7n t\u1eed kh\u00f4ng kh\u1edbp s\u1ebd b\u1ecb lo\u1ea1i b\u1ecf.<\/p>\n\n\n\n<p>\u0110i\u1ec3m kh\u00e1c bi\u1ec7t duy nh\u1ea5t gi\u1eefa <code>find()<\/code> v\u00e0 <code>filter()<\/code> l\u00e0:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>filter()<\/code> t\u00ecm ki\u1ebfm trong t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed hi\u1ec7n c\u00f3 (t\u1ee9c l\u00e0 c\u00e1c ph\u1ea7n t\u1eed \u0111ang \u0111\u01b0\u1ee3c ch\u1ecdn).<\/li>\n\n\n\n<li>Trong khi \u0111\u00f3, <code>find()<\/code> ch\u1ec9 t\u00ecm ki\u1ebfm trong c\u00e1c ph\u1ea7n t\u1eed con c\u1ee7a ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn m\u00e0 th\u00f4i.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><strong>Ti\u00eau ch\u00ed<\/strong><\/td><td><strong>find()<\/strong><\/td><td><strong>filter()<\/strong><\/td><\/tr><tr><td>M\u1ee5c \u0111\u00edch<\/td><td>\u0110\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 t\u00ecm t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed con c\u1ee7a ph\u1ea7n t\u1eed \u0111\u01b0\u1ee3c ch\u1ecdn<\/td><td>\u0110\u01b0\u1ee3c d\u00f9ng \u0111\u1ec3 l\u1ecdc t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed.<\/td><\/tr><tr><td>C\u00e1ch ho\u1ea1t \u0111\u1ed9ng<\/td><td>T\u00ecm ph\u1ea7n t\u1eed trong c\u00e2y DOM b\u1eb1ng c\u00e1ch duy\u1ec7t t\u1eeb g\u1ed1c \u0111\u1ebfn l\u00e1.<\/td><td>Tr\u1ea3 v\u1ec1 c\u00e1c ph\u1ea7n t\u1eed ph\u00f9 h\u1ee3p v\u00e0 lo\u1ea1i b\u1ecf nh\u1eefng ph\u1ea7n t\u1eed kh\u00f4ng ph\u00f9 h\u1ee3p.<\/td><\/tr><tr><td>Ph\u1ea1m vi t\u00ecm ki\u1ebfm<\/td><td>Ch\u1ec9 t\u00ecm trong c\u00e1c ph\u1ea7n t\u1eed con.<\/td><td>T\u00ecm trong t\u1ea5t c\u1ea3 c\u00e1c ph\u1ea7n t\u1eed hi\u1ec7n c\u00f3.<\/td><\/tr><tr><td>Ph\u1ea7n t\u1eed r\u1ed7ng<\/td><td>Kh\u00f4ng th\u1ef1c thi h\u00e0m v\u1edbi c\u00e1c ph\u1ea7n t\u1eed r\u1ed7ng.<\/td><td>Kh\u00f4ng th\u1ef1c thi h\u00e0m v\u1edbi c\u00e1c ph\u1ea7n t\u1eed r\u1ed7ng.<\/td><\/tr><tr><td>\u1ea2nh h\u01b0\u1edfng m\u1ea3ng g\u1ed1c<\/td><td>Kh\u00f4ng l\u00e0m thay \u0111\u1ed5i m\u1ea3ng g\u1ed1c.<\/td><td>Kh\u00f4ng l\u00e0m thay \u0111\u1ed5i m\u1ea3ng g\u1ed1c.<\/td><\/tr><tr><td>C\u00fa ph\u00e1p<\/td><td><code>array.find(function(value, index, array), thisValue)<\/code><\/td><td><code>array.filter(function(value, index, array), thisValue)<\/code><\/td><\/tr><tr><td><\/td><td>N\u1ebfu kh\u00f4ng t\u00ecm th\u1ea5y ph\u1ea7n t\u1eed n\u00e0o, ph\u01b0\u01a1ng th\u1ee9c n\u00e0y s\u1ebd tr\u1ea3 v\u1ec1 undefined.<\/td><td>Trong filter(), m\u1ed9t gi\u00e1 tr\u1ecb s\u1ebd \u0111\u01b0\u1ee3c truy\u1ec1n v\u00e0o h\u00e0m d\u01b0\u1edbi d\u1ea1ng thisValue.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-cac-cau-h\u1ecfi-th\u01b0\u1eddng-g\u1eb7p-v\u1ec1-find-class-jquery\"><span class=\"ez-toc-section\" id=\"Cac_cau_hoi_thuong_gap_ve_find_class_jQuery\"><\/span><strong>C\u00e1c c\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p v\u1ec1 find class jQuery<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-lam-sao-d\u1ec3-ki\u1ec3m-tra-m\u1ed9t-ph\u1ea7n-t\u1eed-co-nhi\u1ec1u-class-b\u1eb1ng-jquery\"><strong>L\u00e0m sao \u0111\u1ec3 ki\u1ec3m tra m\u1ed9t ph\u1ea7n t\u1eed c\u00f3 nhi\u1ec1u class b\u1eb1ng jQuery?<\/strong><\/h3>\n\n\n\n<p>Trong jQuery, b\u1ea1n c\u00f3 th\u1ec3 ki\u1ec3m tra xem m\u1ed9t ph\u1ea7n t\u1eed c\u00f3 nhi\u1ec1u class hay kh\u00f4ng b\u1eb1ng c\u00e1ch d\u00f9ng h\u00e0m <code>hasClass()<\/code> k\u1ebft h\u1ee3p v\u1edbi c\u00e1c to\u00e1n t\u1eed logic. V\u00ed d\u1ee5, n\u1ebfu b\u1ea1n mu\u1ed1n ki\u1ec3m tra xem m\u1ed9t ph\u1ea7n t\u1eed c\u00f3 \u0111\u1ed3ng th\u1eddi c\u1ea3 <code>class1<\/code> v\u00e0 <code>class2<\/code> hay kh\u00f4ng, b\u1ea1n c\u00f3 th\u1ec3 vi\u1ebft nh\u01b0 sau:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>\/\/ Ki\u1ec3m tra ph\u1ea7n t\u1eed c\u00f3 \u0111\u1ed3ng th\u1eddi c\u1ea3 class1 V\u00c0 class2\n\nif ($('#element').hasClass('class1') &amp;&amp; $('#element').hasClass('class2')) {\n\n\u00a0\u00a0\u00a0\u00a0console.log('Element c\u00f3 c\u1ea3 hai class');\n\n}\n\n\/\/ Ki\u1ec3m tra ph\u1ea7n t\u1eed c\u00f3 \u00edt nh\u1ea5t m\u1ed9t trong c\u00e1c class\n\nif ($('#element').hasClass('class1') || $('#element').hasClass('class2')) {\n\n\u00a0\u00a0\u00a0\u00a0console.log('Element c\u00f3 \u00edt nh\u1ea5t m\u1ed9t trong hai class');\n\n}<\/code><\/pre>\n\n\n\n<p>Trong \u0111o\u1ea1n code tr\u00ean, <code>$('#element')<\/code> d\u00f9ng \u0111\u1ec3 ch\u1ecdn ph\u1ea7n t\u1eed c\u00f3 id l\u00e0 &#8216;element&#8217;. Sau \u0111\u00f3, <code>hasClass('class1')<\/code> v\u00e0 <code>hasClass('class2')<\/code> s\u1ebd ki\u1ec3m tra xem ph\u1ea7n t\u1eed \u0111\u00f3 c\u00f3 ch\u1ee9a c\u1ea3 hai class t\u01b0\u01a1ng \u1ee9ng hay kh\u00f4ng.<\/p>\n\n\n\n<p>D\u1ea5u <code>&amp;&amp;<\/code> c\u00f3 ngh\u0129a l\u00e0 c\u1ea3 hai \u0111i\u1ec1u ki\u1ec7n \u0111\u1ec1u ph\u1ea3i \u0111\u00fang th\u00ec \u0111o\u1ea1n code b\u00ean trong m\u1edbi \u0111\u01b0\u1ee3c th\u1ef1c thi.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-lam-sao-d\u1ec3-xoa-m\u1ed9t-class-kh\u1ecfi-ph\u1ea7n-t\u1eed-b\u1eb1ng-jquery\"><strong>L\u00e0m sao \u0111\u1ec3 x\u00f3a m\u1ed9t class kh\u1ecfi ph\u1ea7n t\u1eed b\u1eb1ng jQuery?<\/strong><\/h3>\n\n\n\n<p>B\u1ea1n c\u00f3 th\u1ec3 d\u00f9ng h\u00e0m <code>removeClass()<\/code> trong jQuery \u0111\u1ec3 x\u00f3a m\u1ed9t class kh\u1ecfi m\u1ed9t ph\u1ea7n t\u1eed. V\u00ed d\u1ee5 nh\u01b0 sau:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$('#element').removeClass('class1');<\/code><\/pre>\n\n\n\n<p>Trong \u0111o\u1ea1n code n\u00e0y, <code>$('#element')<\/code> s\u1ebd ch\u1ecdn ph\u1ea7n t\u1eed c\u00f3 id l\u00e0 <code>'element'<\/code>, c\u00f2n <code>removeClass('class1')<\/code> s\u1ebd x\u00f3a class <code>'class1'<\/code> kh\u1ecfi ph\u1ea7n t\u1eed \u0111\u00f3 n\u1ebfu n\u00f3 \u0111ang t\u1ed3n t\u1ea1i. \u0110\u00e2y l\u00e0 c\u00e1ch nhanh g\u1ecdn \u0111\u1ec3 c\u1eadp nh\u1eadt l\u1ea1i giao di\u1ec7n hay tr\u1ea1ng th\u00e1i c\u1ee7a m\u1ed9t th\u00e0nh ph\u1ea7n HTML.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-lam-sao-d\u1ec3-b\u1eadt-t\u1eaft-m\u1ed9t-class-tren-ph\u1ea7n-t\u1eed-b\u1eb1ng-jquery\"><strong>L\u00e0m sao \u0111\u1ec3 b\u1eadt\/t\u1eaft m\u1ed9t class tr\u00ean ph\u1ea7n t\u1eed b\u1eb1ng jQuery?<\/strong><\/h3>\n\n\n\n<p>B\u1ea1n c\u00f3 th\u1ec3 d\u00f9ng h\u00e0m <code>toggleClass()<\/code> trong jQuery \u0111\u1ec3 b\u1eadt\/t\u1eaft m\u1ed9t class tr\u00ean m\u1ed9t ph\u1ea7n t\u1eed. Ngh\u0129a l\u00e0: n\u1ebfu ph\u1ea7n t\u1eed \u0111ang c\u00f3 class, th\u00ec n\u00f3 s\u1ebd b\u1ecb x\u00f3a; c\u00f2n n\u1ebfu ch\u01b0a c\u00f3, th\u00ec class \u0111\u00f3 s\u1ebd \u0111\u01b0\u1ee3c th\u00eam v\u00e0o. \u0110\u00e2y l\u00e0 c\u00e1ch c\u1ef1c k\u1ef3 ti\u1ec7n khi b\u1ea1n mu\u1ed1n thay \u0111\u1ed5i giao di\u1ec7n hay tr\u1ea1ng th\u00e1i ch\u1ec9 v\u1edbi m\u1ed9t h\u00e0nh \u0111\u1ed9ng.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>$('#element').toggleClass('class1');<\/code><\/pre>\n\n\n\n<p>Trong \u0111o\u1ea1n n\u00e0y, <code>$('#element')<\/code> s\u1ebd ch\u1ecdn ph\u1ea7n t\u1eed c\u00f3 id l\u00e0 <code>'element'<\/code>, v\u00e0 <code>toggleClass('class1')<\/code> s\u1ebd b\u1eadt\/t\u1eaft class <code>'class1'<\/code> tr\u00ean ph\u1ea7n t\u1eed \u0111\u00f3. R\u1ea5t ph\u00f9 h\u1ee3p \u0111\u1ec3 d\u00f9ng khi l\u00e0m hi\u1ec7u \u1ee9ng hover, \u1ea9n\/hi\u1ec7n, chuy\u1ec3n tr\u1ea1ng th\u00e1i&#8230; ch\u1ec9 v\u1edbi m\u1ed9t d\u00f2ng l\u1ec7nh.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-t\u1ed5ng-k\u1ebft-v\u1ec1-find-jquery\"><span class=\"ez-toc-section\" id=\"Tong_ket_ve_find_jQuery\"><\/span><strong>T\u1ed5ng k\u1ebft v\u1ec1 find jQuery<\/strong><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><strong>Find class jQuery<\/strong> l\u00e0 m\u1ed9t c\u00f4ng c\u1ee5 m\u1ea1nh m\u1ebd gi\u00fap b\u1ea1n thao t\u00e1c linh ho\u1ea1t v\u1edbi c\u00e1c ph\u1ea7n t\u1eed con trong DOM. B\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng <code>find()<\/code> \u0111\u00fang c\u00e1ch, b\u1ea1n kh\u00f4ng ch\u1ec9 \u0111\u01a1n gi\u1ea3n h\u00f3a code m\u00e0 c\u00f2n t\u0103ng kh\u1ea3 n\u0103ng t\u00e1i s\u1eed d\u1ee5ng v\u00e0 b\u1ea3o tr\u00ec trong c\u00e1c d\u1ef1 \u00e1n Front-end. Hy v\u1ecdng v\u1edbi th\u00f4ng tin t\u1eeb ITviec s\u1ebd gi\u00fap b\u1ea1n h\u1ecdc h\u1ecfi th\u00eam \u0111\u01b0\u1ee3c nh\u1eefng ki\u1ebfn th\u1ee9c m\u1edbi v\u00e0 l\u00e0m n\u1ec1n t\u1ea3ng \u0111\u1ec3 ph\u00e1t tri\u1ec3n t\u1ed1t tr\u00ean h\u00e0nh tr\u00ecnh l\u1eadp tr\u00ecnh vi\u00ean nh\u00e9.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><em>Xem th\u00eam: <\/em><a href=\"https:\/\/itviec.com\/blog\/jquery-la-gi\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong><em>jQuery l\u00e0 g\u00ec? Nh\u1eefng \u0111i\u1ec1u c\u1ea7n bi\u1ebft v\u1ec1 th\u01b0 vi\u1ec7n JavaScript<\/em><\/strong><\/a><\/p>\n<\/blockquote>\n","protected":false},"excerpt":{"rendered":"<p>Find jQuery l\u00e0 m\u1ed9t trong nh\u1eefng k\u1ef9 thu\u1eadt th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng khi c\u1ea7n truy xu\u1ea5t c\u00e1c ph\u1ea7n t\u1eed con theo class c\u1ee5 th\u1ec3 trong c\u00e2y DOM. Nh\u1edd v\u00e0o ph\u01b0\u01a1ng th\u1ee9c find() c\u1ee7a jQuery, l\u1eadp tr\u00ecnh vi\u00ean c\u00f3 th\u1ec3 d\u1ec5 d\u00e0ng l\u1ef1a ch\u1ecdn c\u00e1c ph\u1ea7n t\u1eed n\u1eb1m s\u00e2u b\u00ean trong c\u1ea5u tr\u00fac HTML m\u00e0 kh\u00f4ng [&hellip;]<\/p>\n","protected":false},"author":207,"featured_media":88654,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_gspb_post_css":"","footnotes":""},"categories":[109],"tags":[],"class_list":["post-88572","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-chuyen-mon-it"],"blocksy_meta":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.8 (Yoast SEO v27.8) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t - ITviec Blog<\/title>\n<meta name=\"description\" content=\"H\u01b0\u1edbng d\u1eabn c\u00e1c c\u00e1ch d\u00f9ng Find jQuery \u0111\u1ec3 truy xu\u1ea5t c\u00e1c ph\u1ea7n t\u1eed con theo class c\u1ee5 th\u1ec3 trong DOM gi\u00fap ti\u1ebft ki\u1ec7m th\u1eddi gian khi thao t\u00e1c.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t\" \/>\n<meta property=\"og:description\" content=\"Find jQuery l\u00e0 m\u1ed9t trong nh\u1eefng k\u1ef9 thu\u1eadt th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng khi c\u1ea7n truy xu\u1ea5t c\u00e1c ph\u1ea7n t\u1eed con theo class c\u1ee5 th\u1ec3 trong c\u00e2y DOM. Nh\u1edd v\u00e0o ph\u01b0\u01a1ng th\u1ee9c find()\" \/>\n<meta property=\"og:url\" content=\"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/\" \/>\n<meta property=\"og:site_name\" content=\"ITviec Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/ITviec\" \/>\n<meta property=\"article:published_time\" content=\"2025-06-29T08:57:29+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-06-29T15:32:08+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-vippro-scaled.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2560\" \/>\n\t<meta property=\"og:image:height\" content=\"1347\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Uyen Ngo\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ITviec\" \/>\n<meta name=\"twitter:site\" content=\"@ITviec\" \/>\n<meta name=\"twitter:label1\" content=\"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi\" \/>\n\t<meta name=\"twitter:data1\" content=\"Uyen Ngo\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"16 ph\u00fat\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t - ITviec Blog","description":"H\u01b0\u1edbng d\u1eabn c\u00e1c c\u00e1ch d\u00f9ng Find jQuery \u0111\u1ec3 truy xu\u1ea5t c\u00e1c ph\u1ea7n t\u1eed con theo class c\u1ee5 th\u1ec3 trong DOM gi\u00fap ti\u1ebft ki\u1ec7m th\u1eddi gian khi thao t\u00e1c.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/","og_locale":"vi_VN","og_type":"article","og_title":"Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t","og_description":"Find jQuery l\u00e0 m\u1ed9t trong nh\u1eefng k\u1ef9 thu\u1eadt th\u01b0\u1eddng \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng khi c\u1ea7n truy xu\u1ea5t c\u00e1c ph\u1ea7n t\u1eed con theo class c\u1ee5 th\u1ec3 trong c\u00e2y DOM. Nh\u1edd v\u00e0o ph\u01b0\u01a1ng th\u1ee9c find()","og_url":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/","og_site_name":"ITviec Blog","article_publisher":"https:\/\/www.facebook.com\/ITviec","article_published_time":"2025-06-29T08:57:29+00:00","article_modified_time":"2025-06-29T15:32:08+00:00","og_image":[{"width":2560,"height":1347,"url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-vippro-scaled.png","type":"image\/png"}],"author":"Uyen Ngo","twitter_card":"summary_large_image","twitter_creator":"@ITviec","twitter_site":"@ITviec","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"Uyen Ngo","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"16 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#article","isPartOf":{"@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/"},"author":{"name":"Uyen Ngo","@id":"https:\/\/itviec.com\/blog\/#\/schema\/person\/f4cd1226846e0258c664e170d3e52d20"},"headline":"Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t","datePublished":"2025-06-29T08:57:29+00:00","dateModified":"2025-06-29T15:32:08+00:00","mainEntityOfPage":{"@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/"},"wordCount":3694,"publisher":{"@id":"https:\/\/itviec.com\/blog\/#organization"},"image":{"@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#primaryimage"},"thumbnailUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-vippro-scaled.png","articleSection":["Chuy\u00ean m\u00f4n IT"],"inLanguage":"vi"},{"@type":"WebPage","@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/","url":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/","name":"Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t - ITviec Blog","isPartOf":{"@id":"https:\/\/itviec.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#primaryimage"},"image":{"@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#primaryimage"},"thumbnailUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-vippro-scaled.png","datePublished":"2025-06-29T08:57:29+00:00","dateModified":"2025-06-29T15:32:08+00:00","description":"H\u01b0\u1edbng d\u1eabn c\u00e1c c\u00e1ch d\u00f9ng Find jQuery \u0111\u1ec3 truy xu\u1ea5t c\u00e1c ph\u1ea7n t\u1eed con theo class c\u1ee5 th\u1ec3 trong DOM gi\u00fap ti\u1ebft ki\u1ec7m th\u1eddi gian khi thao t\u00e1c.","breadcrumb":{"@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/"]}]},{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#primaryimage","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-vippro-scaled.png","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/06\/find-class-jquery-vippro-scaled.png","width":2560,"height":1347},{"@type":"BreadcrumbList","@id":"https:\/\/itviec.com\/blog\/huong-dan-find-jquery\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Chuy\u00ean m\u00f4n IT","item":"https:\/\/itviec.com\/blog\/chuyen-mon-it\/"},{"@type":"ListItem","position":2,"name":"Find jQuery: H\u01b0\u1edbng d\u1eabn t\u00ecm ph\u1ea7n t\u1eed theo class chu\u1ea9n nh\u1ea5t"}]},{"@type":"WebSite","@id":"https:\/\/itviec.com\/blog\/#website","url":"https:\/\/itviec.com\/blog\/","name":"ITviec Blog","description":"IT Jobs &amp; People in Vietnam","publisher":{"@id":"https:\/\/itviec.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/itviec.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"vi"},{"@type":"Organization","@id":"https:\/\/itviec.com\/blog\/#organization","name":"ITviec","url":"https:\/\/itviec.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2018\/12\/itviec-black-square-facebook.png","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2018\/12\/itviec-black-square-facebook.png","width":1800,"height":1800,"caption":"ITviec"},"image":{"@id":"https:\/\/itviec.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/ITviec","https:\/\/x.com\/ITviec","https:\/\/www.linkedin.com\/company\/itviec","https:\/\/www.youtube.com\/channel\/UCYthAQ3bcGr57M_ag5gHDvQ"]},{"@type":"Person","@id":"https:\/\/itviec.com\/blog\/#\/schema\/person\/f4cd1226846e0258c664e170d3e52d20","name":"Uyen Ngo","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/ngo-thieu-my-uyen-author-e1709880420317-100x100.jpg","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/ngo-thieu-my-uyen-author-e1709880420317-100x100.jpg","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/ngo-thieu-my-uyen-author-e1709880420317-100x100.jpg","caption":"Uyen Ngo"},"url":"https:\/\/itviec.com\/blog\/author\/uyen-ngo\/"}]}},"_links":{"self":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/88572","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/users\/207"}],"replies":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/comments?post=88572"}],"version-history":[{"count":3,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/88572\/revisions"}],"predecessor-version":[{"id":88655,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/88572\/revisions\/88655"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/media\/88654"}],"wp:attachment":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/media?parent=88572"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/categories?post=88572"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/tags?post=88572"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}