justify - Best approach

Question

webkit browser is not supported "ruby of justify".

I found this javascript (https://code.google.com/p/justify/).

As a result of using this, a new problem has occurred...

 <ul id="list">
  <li>
   <h3 id="main"><ruby>Lorem<rt id="sub">Ipsum</rt></ruby></h3>
   <p>Lorem ipsum dolor sit amet...... </p>
  </li>
 </ul>

This is fine. But this script used "document.getElementById".

When the element is increased, of course, it does not work.

When I rewrite "document.getElementById" to "document.getElementsByClass", Uncaught TypeError: Object #<NodeList> has no method...

When the element is increased, what I do I do?

(Sorry... I'm not good at English)

Answer 1

Uncaught TypeError: Object #<NodeList> has no method...

This error occurs because you are trying to treat a list of nodes like a single node. Probably because you are forgetting to get an element out of the result of getElementsByClassName.

getElementById returns a single DOM element, but getElementsByClassName returns a list (array-like object) of DOM elements. You have to index into the latter, but not the former.

<div class="foo" id="bar"></div>

<script>
alert(
    document.getElementById('bar')   // One result at most, so no [0].
    ===
    // ClassName, not Class.  [0] since the result is a list.
    document.getElementsByClassName('foo')[0]
);
</script>

should alert "true"