Getting an empty value with val()

I have table with the following id inside one of the rows <td class="firstRow"> <span id="randomWordToTranslate"></span></td> the firstRow class just include padding preferences in css.

In my java script class, I am calling two functions the first randomly assigned a value to this id , so when I am loading my page I will get a different word each time : this part is working $("#randomWordToTranslate").html(current_dict[listOfKeys[Math.floor(Math.random() * listOfKeys.length)]]);

the second inside a button listener trying to get the value of the word inside this field whenever the button is clicked

var spanishWord = $("#randomWordToTranslate");
var inputValue = $(spanishWord).val();

but when I doing console.log(inputValue) I am printing an empty row into my log. Any ideas?




Since the <span> isn't an <input> tag (or other form input like <select>), it will not have a .val() (value). Instead, you need either .html() or .text():

var spanishWord = $("#randomWordToTranslate");
var inputValue = spanishWord.text();
// Or:
var inputValue = spanishWord.html();


Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us Javascript

©2020 All rights reserved.