How to read property input 'value' on dynamic element

Question

var boxmaterial = document.getElementsByClassName("spb-productoptiontextcolor spb-productoptionbackground")[0].value;
console.log(boxmaterial)

I have this code in a script but when I load the page I recieve

Uncaught TypeError: Cannot read property 'value' of undefined
at HTMLDocument.<anonymous> (product.js?2684207326912816513:14)
at u (vendor.js?2684207326912816513:14)
at Object.fireWith [as resolveWith] (vendor.js?2684207326912816513:14)
at ready (vendor.js?2684207326912816513:14)

This is because the field hasn't loaded yet since it is being loaded dynamically by a plugin. However when I run the code above in he console window while the page has loaded it works.

Is there a way to select the input and retrieve the value? You can see the page i am working on here working site

messerbill · Answer 1 · 2018-03-02T17:16:20.330

0

It is not possible to use document.getElementsByClassName() selector with multiple class names - use querySelectorAll instead:

document.querySelectorAll('.spb-productoptiontextcolor,.spb-productoptionbackground')[0].value

getElementsByClassName() with two classes

edited Mar 02 '18 at 17:16

answered Mar 02 '18 at 17:11

messerbill

5,499
1
27
38

If you believe the question is a dupe, please just vote to close it as such. – Rory McCrossan Mar 02 '18 at 17:12
@RoryMcCrossan i was not sure due to the question was about accessing that value but not about using the selector with multiple class names – messerbill Mar 02 '18 at 17:13
yeah that runs in the console and works but when i run it with the page it doesn't work at all. returns Cannot read property 'value' of undefined – user3803699 Mar 02 '18 at 17:22
@user3803699 so there is anything else wrong with your code – messerbill Mar 02 '18 at 17:27

How to read property input 'value' on dynamic element

1 Answers1