My JS variable loading before element exists, so they are empty

Question

I am trying to create a script to manipulate the DOM in Wordpress. My problem is that when creating the variables they appear empty because my script loads before the elements exist. How can I solve this? I have this little test that although it says the element exists, when I check the variable in the console it returns 0.

Many thanks.

var el2 = jQuery(".slick-slide");

if (el2 > 0) {
  console.log('element does NOT exist in DOM');
} else {

  console.log('element exists in DOM');
}

You need to compare `el2.length` to `0`, not the whole jQuery object. — Quentin, Aug 17 '22 at 15:19
I just did, still says "element exists in DOM" then the var is 0 — user12487679, Aug 17 '22 at 15:30

score 0 · Answer 1 · answered Aug 17 '22 at 15:16

0

In jQuery, you do this like

$(function() {
var el2 = jQuery(".slick-slide");

if (el2 > 0) {
  console.log('element does NOT exist in DOM');
} else {

  console.log('element exists in DOM');
}
});

answered Aug 17 '22 at 15:16

ControlAltDel

33,923
10
53
80

still no luck :( – user12487679 Aug 17 '22 at 15:25
Not adding the div jQuery(function() { var slides = jQuery(".slick-slide").length - jQuery(".slick-cloned").length var columnsWidth = (100 / slides)-1.7 var a = "" var last = slides - 1 for (var i = 0; i < slides ; i++) { a += jQuery(".para-testar").append('
') } }); – user12487679 Aug 17 '22 at 15:26

score 0 · Answer 2 · answered Aug 17 '22 at 15:17

0

Try create variables when document is ready

$( document ).ready(function() {
    var el2 = jQuery(".slick-slide");

....

answered Aug 17 '22 at 15:17

Taras S

1

not working still :( – user12487679 Aug 17 '22 at 15:27

My JS variable loading before element exists, so they are empty

2 Answers2