JavaScript bug: receiving an 'undefined' error when using getElementsByClassName

How can I retrieve the children of a specific div that belongs to the "vid_div selected" class? First, I select the correct div using this code:

var vid_div = document.getElementsByClassName('vid_div selected');

However, when attempting to access its children, I receive an undefined result:

var vid = vid_div.children; //this returns undefined

Answer №1

querySelectorAll returns a NodeList containing a collection of nodes. It is important to specify the index within this collection.

var image_div = document.querySelectorAll('.img_container');
var images = image_div[0].children;

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

How can I retrieve form information using Jquery AJAX?

Hey there! I've been working on a code to retrieve key/value pairs from a form on a page when a user clicks submit. Despite trying various methods, I keep encountering errors like: Uncaught TypeError: Cannot use 'in' operator to search for ...

Finding the file in a separate directory within the src path

In my projects directory, I have a folder named projects which contains both a game folder and an engine folder. Inside the engine folder, there is an engine.js file. My issue is that I want to access this engine.js file from my game.html file located in a ...

What is the best way to send a parameter to a component in Vue.js without including it in the URL during routing?

One of my Vue.js components is a SideBar that retrieves JSON data. The JSON data consists of names that correspond to specific URLs which in turn contain more JSON data. { "applicants": "url1", "applications": "url2" ...

Adding a click function to a div individually when they share the same class in HTML

My goal is to include 4 unique divs inside a timeline container: This is how I envision the structure: <div id="timeline" > <div class="timeline-bar t-1"></div> <div class="timeline-bar t-2"> ...

Prevent Popover from appearing on mobile devices in Bootstrap 3

When users hover over social network buttons, a popover appears. This feature works well in browsers but I want to disable it on mobile devices, specifically those without a mouse. <div class="collapse navbar-collapse navbar-ex2-collapse"> ...

The script ceases to function once the page is loaded from a JSON file

I'm facing an issue on my shopping website where the items and products are loaded from a JSON file. The problem is that once the page has loaded, the script fails to work properly. If the items take a little longer to load on the page, the script doe ...

Is there a way to store the JWT response header retrieved with fetch?

I am currently utilizing React and employing fetch to send a request to the server: fetch("http://localhost:8001/api/login", { method: 'post', headers: { "Content-type": "application/x-www-form-urlencoded; charset=UTF-8" }, ...

Troubleshooting Next.js API endpoints with VSCode

Currently, I find myself manually searching for the file (api endpoint) in the /api folder within VSCode where I need to set a breakpoint. In my launch.json, I have the following configuration: { "version": "0.2.0", "configura ...

Jquery form calculation not matching up

I've been struggling to make this jQuery math function work with my form. The snippet works fine, but when I try to integrate it into the actual form, I can't seem to get it aligned properly to perform the required calculations. Any suggestions ...

Transforming a file with a node module that lacks a .js class into a browseable format

I am currently working on browserifying my module. One of the dependencies I have is on this https://www.npmjs.com/package/chilkat_win32. It is present in my node_modules folder and here is how the structure looks: https://i.stack.imgur.com/uw9Pg.png Upo ...

Exploring the benefits of integrating JQuery AJAX with non-unicode websites

Using JQuery's '.serialize' and '.post', I am sending form data via ajax to a non-unicode ASP-based website. The resulting data is URL-encoded in unicode, with characters encoded in double values. Is it possible to encode the form ...

One effective way to remove bold formatting from text that has been altered using execCommand

While I am utilizing document.execCommand to bold and underline text, what I really need is a button that can unbold the text and remove any underlining instead of just toggling them. Unfortunately, using execCommand("removeFormat") is causing some issue ...

Is anyone else having trouble getting the date picker range to work with jQuery?

In my ASP.NET MVC (C#) project, I have the following code snippet: form.cshtml: <div class="form-group"> <label for="birthday" class="cols-sm-2 control-label text-dark">Birthday</label> <div class=& ...

"Troubleshooting the issue of addEventListener failing to work in conjunction

window.addEventListener("onbeforeunload",function() {return "are you sure?"}); Unfortunately, the above code doesn't seem to be functioning as intended. The confirmation box is not being displayed and the page closes without any prompts. While I am ...

run a function once ngFor has completed rendering the data

I'm attempting to run a function every time my ngFor finishes loading data from the API. However, the callback only works on the initial load of the ngFor. How can I make sure that the callback is executed whenever my ngFor data changes? I found a ...

Tips for properly implementing a bcrypt comparison within a promise?

Previously, my code was functioning correctly. However, it now seems to be broken for some unknown reason. I am using MariaDB as my database and attempting to compare passwords. Unfortunately, I keep encountering an error that says "Unexpected Identifier o ...

Setting up a Content Security Policy to allow fetching images from both remote URLs and local sources

My Content-Security-Policy meta configuration looks like this: <meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-eval' 'unsafe-inline'; img-src *; style- ...

What is the best way to center a CSS box on the screen?

I am attempting to center the login box on the screen, but when using position: absolute the background color changes to white. /* all */ .patua_font { font-family: 'Patua One', cursive; } .Roboto_font { font-family: 'Roboto&apo ...

What is the best way to incorporate a solid element onto a see-through background?

I have a link at "http://hastebin.com/julayefoto.xml" and I need assistance in making the content inside the bubble named "Test Test Test" non-transparent while keeping the bubble itself transparent. Any help would be greatly appreciated. Thank you :) ...

Accessing the Div id stored in a session parameter

Is there a way to store the id (div id) into a session variable? This is an example of my code below: <div class='fieldRow'>Options </div> <div id="abcde"></div> <div class='Row'> <?php $user_typ ...