Alter the hue of the div

Having trouble with this code snippet:

function red(opt) {
    var sqr;
    sqr="r"+parseInt(opt);
    hilight_css = {"background-color":"#f00"};
    $(#sqr).css(hilight_css);  
}

I am calling the function like so:

red(questions);

The variable questions is set to 1. The div's id is r1. Despite everything seeming correct, the code isn't working as expected. Can anyone assist in troubleshooting?

If I use alert(sqr) to check sqr, it correctly shows r1, yet the div's color doesn't change.

javascriptjquerycss

Answer №1

Make sure to provide a string as an argument for the $ function, as shown below:

$("#" + sqr).css(hilight_css);

Answer №2

Although Constantinius' response is accurate, I feel it's important to mention that the code can be condensed further:

const colorChange = (option) => {
    $("#"+option).css("background-color", "#f00");
}

Answer №3

Follow these instructions to change the color.

function red(opt)
{
   var sqr;
   sqr="r"+parseInt(opt);
   hilight_css = {"background-color":"#f00"};
   $("#"+sqr).css(hilight_css); 
}

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

Achieving equal height rows in Bootstrap to fill the page height

I'm facing a challenge with my code that consists of 8 bootstrap row elements. I want these rows to have equal height so that when combined, their height is equal to the screen height. Additionally, I need all the rows to be visible without any scroll ...

htmlcssbootstrap-5

Adjust the height of taller images to match the size of other images within a flexbox grid

On my Wordpress category page, I have a flexbox grid showcasing posts with titles and excerpts. Most images have the same proportions, but a few are significantly taller. I'm looking to responsively set the max-height of the tall images to match the h ...

jquerycsswordpressgridflexbox

Incorporate a new attribute into a JSON string using Jackson JSON library

Currently, I am saving a JSON string into a text field within a MySQL database. Following the insertion process, my goal is to enhance the JSON string by incorporating the MySQL line ID using Jackson JSON. Within my Java application, I have a String that ...

javajavascriptjsonjackson

Running a Vue.js application on a hosting platform

I am currently facing an issue with my Vue.js application. I have set up a domain and subdomain for the application and now I want to host it. However, when I try to add the subdomain name, I keep encountering 500 Internal server errors. This is my first t ...

javascriptvue.jsnginxdeployment

Merging two arrays of objects from the same response in JavaScript

How can I efficiently merge two arrays of objects from the same response? let data = [{ "testLevel":"mid", "testId":"m-001", "majorCourse": [ { "courseName":"C++" ...

javascriptangulartypescript

Add inline CSS to the <html> element using TypeScript when clicked on

My experience with TypeScript is still new, and I recently found myself confused when trying to apply inline CSS to a tag on click. I initially thought it would be simple, but in TypeScript, things seem to work differently. I attempted to use document.quer ...

javascripthtmlcsstypescript

Unable to retrieve information from the JSON file

I'm having trouble retrieving data from a JSON file in my script: <script type="text/javascript" src="jquery-1.7.min.js"></script> <script type="text/javascript"> $(document).ready(function () { $('#useruname').ch ...

javascriptjqueryajaxjson

Mongoose currency does not display fractional values

Struggling to implement a Schema with a 'price' field using Mongoose currency by following the guidance in the documentation. However, the output is displaying prices without two decimals (e.g., 499 instead of 4.99). Surprisingly, when I use cons ...

javascriptnode.jsmongodbmongoose-schema

A guide to obtaining a single access token/refresh token for unlimited use with oauth2 on the Spotify API

I'm working on a project that will exclusively rely on one Spotify account, but I'm having trouble grasping the concept of the refresh token in oauth2. Ideally, I want to generate an access token and refresh token through the Spotify API console ...

javascriptajaxoauth-2.0authorizationspotify

The success function of the Ajax request remains untouched by the response

My ajax call isn't triggering the success:function(resp){ ...} Despite receiving a response status of 200 and a non-null Json response. This is my ajax setup: $.ajax({ url: '/url/', type: 'GET', data: { pass_ ...

javascriptjqueryjsonajaxdjango

The URL may change, but Angular remains on the same page without navigating

I am encountering an issue with 2 links in my application. The first time I click on any one of them, it navigates to the corresponding page without any problem. However, when I click on the second link after that, the URL changes but the navigation does n ...

javascriptangularangular-ui-routersingle-page-application

Deleting the HTML element

Can someone assist me with my script issue? I am facing a problem: when I open my file on fullscreen (over 768px), and move my pointer around the logo div, nothing happens. However, if I resize my browser to below 768px, then back again above 768px, the ...

javascripthtml

When the CSS style sheet is not embedded within the HTML document, it fails

I'm facing an issue while trying to apply currency formatting to an HTML table in order to have it display correctly when opened in Excel. Initially, I tried doing this inline and it worked fine, like so: <td style="mso-number-format:$\##&bso ...

cssexcel

Creating a repetitive animation effect using CSS3 transforms

I am looking to add an animation effect that creates a "shaking" motion on an image when hovered over. This effect is similar to the shaking of app icons on iPhones when held down for a few seconds. Ideally, I would like to achieve this using pure CSS3, b ...

jquerycss

Can you explain the functionality of sinon's stub.yields method?

The explanation given in the documentation for sinon regarding stub.yields is as follows: By using stub.yields([arg1, arg2, ...]), you are essentially performing a function similar to callsArg. This will result in the stub executing the first callback it ...

javascriptsinon

Array fed with Mongoose query

Currently experiencing challenges with a section of my code. I am utilizing Mongoose to retrieve data from my database, where I intend to push a portion of that data into an array titled 'authors' for further manipulation. Although I am able to ...

javascriptnode.jsmongoose

Utilizing the Ternary Operator within ReactJs Card Headers

Is it possible to include a ternary operator in the title of CardHeader using ReactJS? I am able to include the first name but encountering issues with including the last name as well. <CardHeader title={(firstName ? firstName : "") + " " + (lastName ...

javascriptreactjsecmascript-6material-uiconditional-operator

Position the caret beneath the anchor text

<a href="#" class="dropdown-toggle" data-toggle="dropdown" style="text-decoration: none"> <span class="criteria">any</span> <span class="caret" style="margin-top:6px;"></span> </a> The code snippet above ...

htmlcss

Passing PHP data to a JavaScript file using JSON格式

I have a query regarding how to pass php variables and send their values to a js file using json. Here is what I currently have: <?php $data = array('artist' => $artistname, 'title' => $songname); echo json_encode($data); // ...

javascriptphpjson

Ways to organize backbone models, views, and collections using vim?

I am a fan of vim's folding feature, but I have encountered some challenges when trying to fold backbone models, views, and collections. This is because backbone does not follow the traditional prototype syntax, but instead uses a .extend() based synt ...

javascriptbackbone.jsvim