-1

I can not access this data within the div with javascript. 

<div class="questions-text-alignment whiteTextWithShadow question-size-v4">
  DATA HERE
</div>

Any suggestions?

Brock Adams
  • 90,639
  • 22
  • 233
  • 295
Steven Tang
  • 954
  • 1
  • 7
  • 21
  • How did you try to access it? – Flakes Nov 28 '15 at 06:00
  • I attempted unsuccessfully to get the value by using getElementByClassName('questions-text-alignment whiteTextWithShadow question-size-v4') -- Tried using .innerHTML ;;; .value ;;; .innerText – Steven Tang Nov 28 '15 at 06:02
  • 1
    use `document.getElementsByClassName("question-size-4")` or apply `ID` to this div and use `document.getElementById("newid").innerHTML`. when you use classname you will get array of elements. You have to iterate that one and get the appropriate one. – Suresh Ponnukalai Nov 28 '15 at 06:05
  • Tried that too, how would I inject an id into this div? – Steven Tang Nov 28 '15 at 06:06
  • You give it an ID the same way you gave it a class. `
    ` The only difference it that a specific ID can only be used on one element.     – Sam Nov 28 '15 at 06:08
  • The only thing that returns something other than undefined is document.getElementsByClassName("questions-text-alignment") – Steven Tang Nov 28 '15 at 06:10
  • This is on an external site that I can not edit the HTML so adding an id is not an option. – Steven Tang Nov 28 '15 at 06:10
  • Nevermind I figured it out myself. – Steven Tang Nov 28 '15 at 06:13
  • Surprisingly, couldn't find a dupe target. Although https://stackoverflow.com/questions/8331616/get-the-content-when-the-div-does-not-have-the-id-of-the-div-only-has-the-cl is close... – Brock Adams Dec 26 '17 at 03:59

5 Answers5

1

Way 1

You can access the data using jQuery in the following way:

<script>
$(document).ready(function(){
    var data = $(".questions-text-alignment").html();
    alert(data);
})
</script>

Way 2

Without jQuery:

<script>
    var data = document.getElementsByClassName("questions-text-alignment");
    alert(data[0].innerHTML);
</script>
kwoxer
  • 3,734
  • 4
  • 40
  • 70
sanjeev
  • 26
  • 3
0

You can access using document.getElementsByClassName(), But the thing is you will get an array object. Using the array you have to find out yours. In the below sample I have assumed only one class available.

 var arr = document.getElementsByClassName("question-size-v4");

 alert(arr[0].innerHTML);

DEMO

Suresh Ponnukalai
  • 13,820
  • 5
  • 34
  • 54
0

You can try like this 

<script>
    function getHtml() {
        var html = document.getElementsByClassName("questions-text-alignment")[0];
        alert(html.innerHTML);
    }

</script>
<div class="questions-text-alignment whiteTextWithShadow question-size-v4">
    DATA HERE
</div>
<input type="button" name="click" value="click" onclick="getHtml()" />
Dharmeshsharma
  • 683
  • 1
  • 11
  • 28
0

You should Use Id to select element in this scenario - DEMO

<script>
function changeData() { 
    document.getElementById('contentDiv').innerHTML= "Updated Content";
}
</script>

<body>
  <div id="contentDiv">
    Content Of My Div
  </div> </br>
  <input type = "button" onClick = "changeData()" 
   value = "change div text" />
</body>
shakhawat
  • 2,639
  • 1
  • 20
  • 36
-1

@StevenTang I exactly got stuck on the same problem and here is my solution.

document.getElementsByClassName("question-size-4")

works fine on full HTML document load and only if you have a single DIV object identified by this class name.

Otherwise you get HTMLCollection object for preview via ChromeTools to be opened in your web browser.

To identify individual DIV object, including your Class name and Data Here use Firebug and select your Data and open in Firebug with right mouse click (submenu select).

Once your DIV object selected and identified to include your class name and your Data Here is opened in console.log (Chrome tools), clicking on HTMLCollection you get every DIV object identified by index (natural number) as in array.

Selecting the correct index (natural number), you can access your Data Here via

elements = document.getElementsByClassName("question-size-4");

DataHere = elements[correct DIV index].innerHTML   or .innerText

You need to manipulate

x = elements.length;

first to know if any such DIV object identified by your class name really exists and has been downloaded.

If x = 0 it means HTMLCollection is empty and elements.innerHTML generates undefined string

If x = 1 there is exactly a single DIV identified by your class name, so elements.innerHTML should work fine

If x > 1; you have got more DIV objects identified by your class name, so you needd to select the correct one from array data stracture, entering correct index, as above.

It took me months to study the problem and to find the correct answer.

thank you

darius
  • 29
  • 1
  • 8