CODEWITHSUNDEEP
javascriptjquery
Skynet
Skynet

Reputation: 47

Some Javascript code not working, only jquery code

I have an external javascript file where I wrote jquery code and javascript code but the javascript code isn't working. Only the alert is working.

I want some texts to flash different colors but it doesn't.

When I inspect elements using ctrl+shift+i I see the colors changing under inspect element, but it doesn't change in the webpage.

Something like it's running on the background or what I really don't know.

function flash() { var text = document.getElementById('sales'); text.style.color=(text.style.color=='red')? 'green' : 'red'; } var clr = setInterval(flash, 500)
<p id="sales"> <h3 style ="text-align: center; font-weight: bold;"> Flash Sales </h3></p>

Upvotes: 0

Views: 85

Answers (3)

Skynet
Skynet

Reputation: 47

I was able to solve the issue by removing the in-line styling all the way from the <h3 tag and styled it in css.

Upvotes: 0

Phylogenesis
Phylogenesis

Reputation: 7890

If you properly check the inspection, you'll see that your HTML was changed from what you have. A <p> element cannot contain a <h3> element, and the DOM has been changed to <p id="sales"></p><h3>...</h3>.

As such, your CSS is being applied to the wrong place.

function flash() { var text = document.getElementById('sales'); text.style.color=(text.style.color=='red')? 'green' : 'red'; } var clr = setInterval(flash, 500)
<h3 id="sales" style ="text-align: center; font-weight: bold;"> Flash Sales </h3>

Upvotes: 2

Dipen Bedia
Dipen Bedia

Reputation: 1

In pure java script

document.querySelector('element name').style.color = 'red';

In jquery

$('element name').css({red : 'red'});

Upvotes: -1

Related Questions