Skip to content
the poor coder

Target one specific Jquery Data Table theader for CSS styles

Poor Man
Published
Reading time
1 min read
JavaScript

// Targetting a single jQuery DataTable theader for css styles
$("#myTableId th").css("background-color", "#F1F1F1");
$("#myTableId th").css("color", "#3F3F3F");
$("#myTableId th").css("font-family", "Verdana, sans-serif");
$("#myTableId th").css("font-size", "14px");
$("#myTableId th").css("border-bottom", "2px solid #F8F8F8");
$("#myTableId th").css("padding", "5px 10px");

This code target a single jQuery DataTable theader and applies a few different css styles. The $("#myTableId th") code selects all the theader elements of the table with the id of myTableId and applies the css styles. The styles that are applied are a background color of #F1F1F1, color of #3F3F3F, font-family of Verdana, sans-serif, font-size of 14px, border-bottom of 2px solid #F8F8F8, and padding of 5px 10px. This will give the theader of the table a consistent look and feel across all browsers. If you wanted to target multiple theaders within a single table you could chain the $("#myTableId th") code together with additional css selectors. For example you could target the first theader with $("#myTableId th:first") and the last theader with $("#myTableId th:last"). It is important to note that the jQuery DataTable theaders are not visible by default, so the css styles applied to them will not be visible until the table is initialized. You can initialize the jQuery DataTable with $("#myTableId").DataTable();.

Keep going

2023

how to sort an array

How to Sort an Array If you have an array and you want to order its elements in a specific way, you need to use a sorting algorithm. There are several sorting algorithms available, but two of the most commonly used are…

javascript2 min read
2023

jquery mobile or desktop

jQuery Mobile or Desktop? As a web developer, I have had some experience with both jQuery Mobile and jQuery Desktop. Both frameworks have their pros and cons, and which one to use really depends on the specific project…

javascript1 min read
2023

node.js folder structure

Node.js Folder Structure If you are new to Node.js, it can be daunting to create a folder structure that will work for your project. The structure you choose will depend on the size and complexity of your project. Here…

javascript1 min read
ESC