What is the best way to target an anchor element that includes a particular word using jquery or css?

I attempted

$('a[title="*"]').find('contains("PDF")').css({'background-color':'red'});

Unfortunately, this code is not working as expected.

To clarify, I am searching for a specific word in the title.

Answer №1

Here is a helpful solution for you:

Click here for a Live Demo

$('a[title*="PDF"]').css({'background':'red'});

If you need to search with ignore case, try this:

$('a[title*="pdf"]').filter(function(){
    if(this.title.toLowerCase().indexOf("pdf") != -1)
         return $(this);
}).css({'background':'red'});

Answer №2

Change the CSS background color of all links with the title attribute containing "PDF" to red using jQuery:
$('a[title*="PDF"]').css({'background':'red'});

Answer №3

When searching for a particular title, the code snippet is:

$("a[title*='specificTitle']");

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

Retrieve JSON information from a URL via AJAX if applicable

Is there a way to retrieve the JSON data from the following URL and incorporate it into my webpage in some capacity? (Disclaimer: I do not own this website, I am simply utilizing the data for a basic free app.) Although entering the URL directly into the ...

Updating the jQuery $ function to accommodate outdated codebases

After using stackoverflow as a valuable resource for years, I decided to join. I have a good grasp on JavaScript and noticed some questions that I could provide input on. As I delved into the platform, I realized the prevalence of jQuery. This prompted me ...

What causes the CSS `resize` property to be inherited in Chrome browsers?

It was my understanding that elements do not inherit the resize property from their parent elements. However, I recently discovered that in Chromium they actually do: Here is a screenshot of Chromium's inspector: Check out this demo: http://jsfi ...

display PHP JSON information using jQuery AJAX

I'm completely new to this subject. I have a Json result that looks like the following : { "span": " 1", "numcard": "12", "chan": " Yes", "idle": "Yes", "level": "idle ", "call": "No ", "name": "" } My goal is to ...

Select all feature in checkbox is malfunctioning

I need to implement a feature with 3 checkboxes: When the "A" checkbox is clicked, only "A" should be highlighted. Upon clicking the "C" checkbox, only "C" gets highlighted. If the "B" checkbox is clicked, both "A" and "B" nee ...

Dividing a JSON array by a specific key using lodash underscore

I'm on a quest to extract the distinct items in every column of a JSON array. Here is what I aim to convert : var items = [ {"name": "Type 1","id": 13}, {"name": "Type 2","id": 14}, {"name": "Type 3","id": 14}, {"name": "Type 3","id": 13}, {"na ...

Interactive JavaScript button that navigates me to a document without the need to click

I'm facing an issue with my small project. I've been learning javascript and managed to create a script that calculates the square of a number provided by the user. var checkIt = function(){ var theNumber = Number(prompt("Please enter a number ...

Javascript - struggling with implementing changeClass() function on click event

I am working on creating movable images within a container using the jQuery plugin found at . My goal is to have items appear within the container when clicked, but I am struggling with changing the class of my object (.item) outside of the container. Th ...

scraping text content from a CSS node using Scrapy

My goal is to extract a catalog ID number from the following webpage: from scraping.selector import Selector from scraping.http import HtmlResponse url = 'http://www.enciclovida.mx/busquedas/resultados?utf8=%E2%9C%93&busqueda=basica&id=& ...

How to centrally align text in list items using Bootstrap 5

Incorporating Bootstrap 5 into my project, I am facing a challenge with vertically aligning text in an li element. Despite trying various techniques mentioned in the Bootstrap documentation for middle/center alignment, none of them seem to be effective. I ...

The Intriguing Riddle of HTML Semantic

I've been working on a puzzle presented in the link provided below: HTML Structure Challenge This mind-teaser consists of three questions: Modify the HTML code of the website to enhance its structure as follows: Replace the generic outer div eleme ...

Achieving compatibility with IE7 for utilizing "before:" and "after:" pseudo-elements along with the "box-sizing:border

My website is constructed with twitter bootstrap 3 and functions perfectly on all browsers except for IE7. IE7 seems unable to interpret pseudo classes like before:, after:, and box-sizing: border-box. Is there a solution to make IE7 understand this code ...

Rails assets folder is not directed to the specified directory in the layout file

I have a dilemma in the application layout where I'm referencing assets (js, css, and img) in the public/assets/... directory. For example: <link href='assets/images/meta_icons/apple-touch-icon-144x144.png' rel='apple-touch-icon-pre ...

Contrast between the functionalities of $.ajax and $.post

$.post( url, data, callback, type ); $.ajax () Is there a distinction between using $.post and $.ajax in jQuery? And if so, which method is recommended? Also, how many parameters can be passed to the $.ajax function? ...

Creating an SVG element that adjusts to the size of its parent container: tips and tricks

I'm attempting to achieve the following: Displaying an SVG square (with a 1:1 aspect ratio) inside a div element. When the width of the div is greater than its height, the square should adjust to fit within the container based on the height (red box ...

ways to conceal icon image when the textbox is devoid of content

Is there a way to hide the clear icon from a text box if the length inside the text box is less than 1? I attempted the following code, but it didn't work for me. The inner icon is not hidden when the input field length is less than 1. For a demo ex ...

Enhance your website with jQuery's animate() feature for dynamic

My current implementation of jQuery's animate function looks like this: var css1 = { display: "block", marginTop: 20 }; var direction = "marginTop"; $(element).animate(css1, 150, 'swing'); I've noticed the marginTop ...

How can I resize an element using jQuery resizable and then revert it back to its original size with a button click?

I need help figuring out how to revert an element back to its original size after it has been modified with .resizable. I attempted the following: <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="//code. ...

In Node.js, I encountered an issue where req.body was returning as undefined, despite the fact that when I logged req, I could

I am having trouble logging the req.body to the console in my Twilio text app. When I try console.log(req), the body and its contents show up, but it says that the body is undefined when I try to log it on its own. Any help would be greatly appreciated. ...

sending an array from one CodeIgniter view to another view via Ajax

In the following code segments of my application, myArray is an array where each element contains a few objects that I need to use in a second view. When I use alert(myJSON);, I am able to see the array in the alert window. However, when the view loads, i ...