I have the value 60% stored inside a <div class="value-container"> 60% </div>, however when use this query function document.querySelector(.value-container) to get the value, I get this response instead: [object HTMLDivElement]
Find below my HTML code:
<body>
<div class="container">
<div class="circular-progress">
<div class="value-container"> 60% </div>
</div>
</div>
<script>
$(document).ready(function(){
let testing = document.querySelector('.value-container');
console.log("Testing: " +testing);
});
</script>
</body>
This code above yields:
Testing: [object HTMLDivElement]
The desired yield is:
Testing: 60%
How do I capture the value stored inside my <div class="value-container"> 60% </div>?
As mentioned above, query selector returns an element, but to get its inner value document.querySelector('.value-container').innerHTML should be added
The other commenters are correct - you need do something with the object you get back from your querySelector.
But if you only care about the raw text (which it looks like in this case as you just want the 60% value), then document.querySelector('.value-container').textContent is slightly more efficient than innerHTML