Jquery is not working without settimeout in meteorjs-CodePudding

I have a code in helper in meteorjs

Template.tickets.helpers({
    priorityClassColour(priority) {
            setTimeout(() => {
                $(".Low").css('background-color', 'red');
                return 'Low'
            });
    }
})

This works fine without any error but when I move the code of jquery css outside settimeout, the style is not applied to css. When I run $(".Low").css('background-color', 'red'); in browser console then also this works perfectly fine. can somebody tell me why this happens ?

CodePudding user response：

$(".Low") might not exist at the time your jQuery code executes. When you setTimeout it allows $(".Low") to be available then your jquery works.

You can check $(".Low").length outside & inside the setTimeout to findout if it exists in both cases or not.

CodePudding user response：

It's probably because you're trying to update something that hasn't rendered yet. That's why using a timeout makes it work, it gives Blaze a chance to finish rendering.

A better way to do it is to set the CSS style of the element using Blaze helper.

In your template use something like:

<element style={{priorityClassStyle}}/>

Where the priortyClassStyle helper would return the whole style string eg. background-color:red