How can you achieve three layers of nested quotes in Dynamic HTML?

Working on an app that utilizes JQuery and JQTouch for iOS. The issue I'm facing involves dynamically generated HTML lists where the user clicks a row that needs to be highlighted. However, achieving this has proven tricky due to nesting 3 sets of quotes in the code. Currently, I have it functioning using JQuery, but I am looking for a more efficient inline solution since it's just a simple CSS modification. Here's a snippet of my code:

CURRENT_answerHTML += '<li id="1" onClick="this.className=nmclicked">' + localResultsArray[currentQuestionNumber].answer1_text + '</li>\n';

The class nmclicked must be enclosed in quotes from what I understand, but all attempts at proper escaping haven't been successful. The CSS styling is straightforward:

li.nmclicked { background: #5C94E7; }

Any suggestions or solutions would be greatly appreciated. Thank you.

javascripthtmlcssonclickhtml-lists

Answer №1

ADDITIONAL_answerHTML += '<li id="1" onClick="this.className=\'clickednm\'">' + localResultsArray[currentQuestionNumber].answer1_text + '</li>\n';

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

Can HTML5 be used to store IDs in PHP chat applications?

I'm in the process of developing a chat application with PHP. Everything is functioning properly, but I have encountered a potential loophole. I am implementing AJAX to fetch chat data as the user scrolls, similar to platforms like Facebook and Twitte ...

javascriptphpjqueryhtmlchat

What is the location where UIWebView saves HTML5 offline files?

I'm curious about the location where HTML5 offline content is stored when saved from a UIWebView in an iOS app. Is it saved locally within my app's access, or somewhere else? ...

ioshtmluiwebviewoffline-caching

What is a more efficient method for switching between edit mode and view mode in ng-grid?

Up until now, I've only managed to switch the edit mode in ng-grid by using separate templates and showing the correct template based on user input. For example: Plunker (resize a column and then switch to another mode) This poses a problem because ...

javascriptjqueryangularjsng-grid

The functionality of scrolling ceases to work once the bootstrap modal is closed

I am utilizing Bootstrap v3.1.1 to showcase a modal popup on one of my web pages. The following code shows how I have implemented it. <!--Start show add student popup here --> <div class="modal fade" id="add-student" tabindex="-1" role="dialog" a ...

javascriptjquerycssajaxtwitter-bootstrap

Is it possible to organize words with HTML elements utilizing JavaScript?

Code is not properly sorting the elements var element='<p><strike>Mango</strike></p>/n<p><em>Orange</em></p>/n<h1>Apple</h1>/n<p><strong>banana</strong></p>/n<p& ...

javascriptjquery

Updating React state by changing the value of a specific key

I've been diving into React lately and I'm facing an issue with updating state values for a specific key. Below is my current state: this.state = { connections : { facebook : "http://facebook.com", flickr : null, ...

javascriptreactjsecmascript-6react-redux

The placement of toolbar buttons in HTML

My current dilemma involves the placement of a logo on the navigation bar of my website. When the logo is present, the text is not centered vertically, but when I remove the logo it centers correctly. * { margin: 0px; padding: 0px; } .logohead { d ...

htmlcssposition

Tips for shuffling the sequence of EJS variables

I am currently working on creating a quiz that consists of multiple choice questions. In order to display the Question, Correct Answer, and 3 other wrong options, I am utilizing EJS variables. The format will be similar to the following example: Question: ...

javascripthtmlnode.jssortingejs

Is there a way to customize the ::selection style using mui createTheme?

I'm looking to globally change the color and background color of ::selection in my app. Can anyone advise on how to achieve this using createTheme()? ...

javascriptcssreactjsmaterial-ui

Alpha-Beta Pruning Minimax Algorithm Fails to Determine the Best Move in Tic-Tac-Toe Artificial Intelligence

I have been developing a Tic-Tac-Toe AI system that uses the Alpha-Beta Pruning Minimax algorithm to determine the best move for the AI player (X) on the game board. Unfortunately, I am running into an issue where the algorithm is not returning the correct ...

javascriptartificial-intelligenceminimaxalpha-beta-pruning

Spin the div in the opposite direction after being clicked for the second time

After successfully using CSS and Javascript to rotate a div by 45 degrees upon clicking, I encountered an issue when trying to rotate it back to 0 degrees with a second click. Despite my searches for a solution, the div remains unresponsive. Any suggestion ...

javascriptjquerycss

Encountered an error trying to access property 'history' of an undefined value while using react-router v4 and create-react-app

I encountered an issue with using Link to navigate, here's the breakdown of my code: Directory structure components ----App.js ----home ----Home index.js index.js import React from 'react'; import ReactDOM from 'react-dom'; ...

javascriptreactjsreact-router-v4

What could be causing the issue with saving form data to local storage in React?

I am facing an issue with the code I have written to store data in local storage. Sometimes it works fine, but other times it saves empty data or erases the previous data when the Chrome window is closed and reopened. Any idea what could be causing this in ...

javascripthtmlreactjs

Exploring the integration of Stripe Checkout with React and Express.js

Seeking assistance with integrating Stripe Checkout into my React application. I need to create a route in my nodejs/express server that will provide the session id required for setting up Stripe Checkout on the front end. The aim is to redirect users to s ...

javascriptnode.jsreactjsexpressstripe-payments

Display PDF blob in browser using an aesthetically pleasing URL in JavaScript

Using Node, I am retrieving a PDF from the server and sending it to my React frontend. My goal is to display the PDF in the browser within a new tab. The functionality works well, but the URL of the new tab containing the PDF is not ideal. Currently, the U ...

javascriptnode.jspdf

Utilizing JavaScript to dynamically update the user interface after submitting a form using jQuery

I am working on implementing an Input element that triggers a form submission: <input type="submit" value="Download" id="downloadButton" class="btn-download" /> The specific requirement is for the button to first execute a javascript function and t ...

javascriptjqueryhtml

Can an Object be extracted from a nested array using a MongoDB Query?

In my mongoose schema, I have the following structure: var AttendanceSchema = new mongoose.Schema({ ownerId: mongoose.Schema.Types.ObjectId, companyId: mongoose.Schema.Types.ObjectId, months: [ { currentSalary: { type: Number, ...

javascriptmongodbmongoose-schema

validating price ranges with the use of javascript or jquery

<!DOCTYPE html> <html lang="en"> <head> <title>My Page Title</title> </head> <body> <form method="post" action="process-form.php"> Price Range: From <input type="text" id="price-from"> ...

javascriptjqueryvalidation

Having Difficulty Configuring Async Request Outcome

I'm struggling to access the outcome of an asynchronous request made to an rss feed. After reading a post on How do I return the response from an asynchronous call?, which recommended using Promises, I tried implementing one. However, even though the ...

javascriptasynchronousrequest

How does the browser interpret the CSS property transform: none?

Does the transform: none result in matrix(1,0,0,1,0,0) or a different outcome? I am looking to reset the transform; what is the best approach for this? <style> .box{ height: 100px; width: 100px; background-color: red; transition: 0.5s; transform: ...

htmlcsstransform