Incorporating CSS style to individual rows in an HTML table

Is there a way to determine if a specific string, such as 'LA DEFENSE', is present in my HTML table and then change the background color of that line to red?

https://i.sstatic.net/Yq7qF.png

This is what I am looking for:

$("#colorline").click(function() {
       if ($('rejets_communes').contains('LA DEFENSE'){
              #color line by adding style element to the specific line
        }
 }) 

Answer №1

Check out this functional demo.

<table id="myTable">
<tr>
  <td>CENTRAL PARK</td>
  <td>ANOTHER EXAMPLE</td>
</tr>
</table>

For changing the background color of the entire row, you can use:

$('#myTable').find("td:contains('CENTRAL PARK')").parents("tr").css('background-color', 'blue');

If you prefer to change only the cell's background color, try this instead:

$('#myTable').find("td:contains('CENTRAL PARK')").css('background-color', 'blue');

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

I'm getting a JS error saying that the variable "var" is not defined. Does anyone know how I can

Here is the code I am using to dynamically create a sitemap.xml file when accessing /sitemap.xml database = firebase.database(); var ref = database.ref('urls'); ref.on('value', gotData, errData); function errData(err){ ...

Navigating with Angular - sending users to an external webpage?

When working with AngularJS routes, there is the option to use an otherwise route as a replacement for a 404 error: $routeProvider .when(...) .otherwise({ redirectTo: 'my/path' }); Is it possible to configure the otherwise route to redirect ...

As soon as I closed the modal, I noticed that the checked inputs reverted back to

I am using checkboxes within a modal to narrow down my search results. However, I have encountered an issue where when I check multiple checkboxes and then close the modal, the checked inputs become unchecked. Every time I open the modal, I want the check ...

A guide to converting variables into a JSON Object in Javascript

I am looking for a way to insert external variables into a JSON object. An example of what I want: var username = "zvincze"; And then, using that variable to inject it into a JSON object: var json = '{"username":"VARIABLE_GOES_HERE"}' var obj ...

Reading a variable within the fileReader onload function in TypeScript

When attempting to upload an image by reading a base64 path using file reader, I initially encountered issues with variable updates outside of the FileReader onload function. Here is the original code snippet: const reader: FileReader = new FileReader(); ...

In an AngularJS custom filter function, the error message "keys is not defined" is displayed

As I was reviewing examples in an Angular JS book, I came across a concept that has left me puzzled. It involves the use of custom filters with ng-repeat. Below are the code snippets: <a ng-click="selectCategory()" class="btn btn-block btn-default btn- ...

What is the best way to link the roll button to a specific video URL?

I am currently working on a project that involves assigning specific videos to 6 roll buttons for continuous play. For instance, I want the first roll button to display a yellow dice and the second button to show a blue dice, and so on. As of now, I have ...

Creating dynamic ng-options in AngularJS

Below is an array: $scope.age = 2; $scope.people = [{name:"Sam",age:2},{name:"Pam",age:3},{name:"Ham",age:4}] The requirement is to make the ng-options dynamic. When age is 2, display all people objects in ng-options. If age is 1, show only the object wi ...

How to Find and Count Duplicate Values in an Array using AngularJS

My form consists of 5 questions, each with 3 different answers to choose from. For example: q1. What is your favorite color? Radio button-1: blue Radio button-2: red Radio button-3: grey While most questions offer the same values (blue, red, grey), I am ...

Python's Selenium Throws No Such Element Exception

Looking to automate tasks involving hyperlinks on my university's SAP Portal, I decided to use Selenium. However, encountering difficulties as many web elements are dynamically generated using JavaScript, making them invisible to the webdriver. The e ...

Are instance prototypes exhibiting static behavior?

I'm in the process of creating a game for Windows 8 using HTML/Javascript and WinJS, but I'm running into issues with "prototypes" acting statically when they shouldn't. This is my first time working extensively with Javascript and dealing w ...

"Enhance User Experience with a Bootstrap Dropdown Button Offering Block Level Function

I'm attempting to modify a bootstrap 3 dropdown button to fully utilize the width properties of .btn-block class. It appears that the dropdown button does not respond in the same way as regular buttons. Below is my current code: <div class="row"&g ...

Having trouble getting your Bootstrap v4 carousel to function properly?

Currently, I have implemented the carousel feature from Bootstrap v4 in a Vue web application. I am following the same structure as shown in the sample example provided by Bootstrap, but unfortunately, it is not functioning correctly on my local setup and ...

Transferring information from the service layer to the controller

My goal is to transfer data from a service to a controller using AngularJS. Below is the code I am using: .controller('lista',function($scope,cetrams){ $scope.hola="This is it"; var test; var testfn = function(){ test = &apo ...

Sending a Single Input Field value to a Controller in Laravel using JQuery

Looking to submit a single form value using jQuery to a database in Laravel. Below is the input field: <input type="text" id="comment"> <button id="cmntSubmit" type="button">Post</button> Check out the jQuery code I am using: $(docum ...

Having trouble getting the Socket.io package to install on Node.js in Windows 7?

Hey there! I'm having trouble installing the socket.io module using npm install socket.io. Unfortunately, I encountered the following error: npm WARN package.json <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="ee8f80c3869 ...

Struggling to get custom CSS to apply properly in Joomla 4 with Bootstrap 5 template

Having created a simple Bootstrap 5 template for my Joomla 4 website, I've been attempting to customize the navbar with CSS in my user.css file. However, it seems that the styles added in user.css are not being applied. I have verified that user.css ...

Describing a function in Typescript that takes an array of functions as input, and outputs an array containing the return types of each function

Can the code snippet below be accurately typed? function determineElementTypes(...array: Array<(() => string) | (() => number) | (() => {prop: string}) | (() => number[])>) { /// .. do something /// .. and then return an array ...

What is the reason for the JavaScript TypeError (undefined) being triggered when this object is used within a function?

I have defined a new object like this: function node(){ this.tag = null; this.Tdata = []; this.Tchilds = []; } Now, I am trying to use this object in a function: function Validate(root /*Ass ...

Unleashing the full potential of ajax through endless scrolling performance

Recently, I implemented an infinite scroll feature on my website's index page by making ajax requests to retrieve a JSON containing 40 objects. Then, I add them using a JavaScript loop. However, I've noticed that it slows down the site at times. ...