How to pass element to anonymus function in jquery?

Question

I'm creating a countdown element and I want to pass each element to setinterval function to update it each second

                var countDownDate = new Date($(this).data('date')).getTime();

                setInterval(function() {
                    var now = new Date().getTime();

                    var distance = countDownDate - now;

                    // Time calculations for days, hours, minutes and seconds
                    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
                    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
                    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
                    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

                    $(this).find('.days').text(days);
                    $(this).find('.hours').text(hours);
                    $(this).find('.minutes').text(minutes);
                    $(this).find('.seconds').text(seconds);
                }, 1000);
            });

thanks in advance

doesn't change the elements as $(this) isn't exposed to the function — Ahmed Alaa El-Din Hassan, May 22 '22 at 10:05
There's a big difference between "pass an element to a function" and "using`this` inside a function` your question title says one, your *comment* says the other. Please be clear in your question and title. — freedomn-m, May 22 '22 at 10:20
Does this answer your question: [Are arrow functions interchangeable](https://stackoverflow.com/questions/34361379/are-arrow-functions-and-functions-equivalent-interchangeable) — freedomn-m, May 23 '22 at 07:17

score 0 · Accepted Answer · answered May 23 '22 at 10:44

Your questions don't describe what you really wanted, but there are a few ways to access these elements inside the function.

Using an arrow function

 setInterval(() => {
   /*
   your code goes here without changes
   */
 }, 1000)

Passing parameters

 setInterval(function(days, hours, minutes, seconds) {
   /*
   your code goes here without changes
   */
   days.text(days);
   hours.text(hours);
   minutes.text(minutes);
   seconds.text(seconds);
 }, 1000, $(this).find('.days'), $(this).find('.hours'), $(this).find('.minutes'), $(this).find('.seconds'))

Binding

setInterval((function() {
  /*
  your code goes here without changes
  */
}).bind(this), 1000)

You could just also pass this as an argument. I would use the arrow function since it's a more modern approach.

How to pass element to anonymus function in jquery?

1 Answers1