Twitter bootstrap typeahead does not work properly with data-source attribute

Question

Why is it when i use the " sign in the data-source attribute to denote string values all works well but when i use ' to denote them bootstrap is recognizing only the first character?

I know in c# and many other language the difference between " and ' is the difference between a character and a string but its the first time i see it is strictly used in html is that the case here if so why isn't there any error in the JS.

<div class="container">
    <div class="hero-unit">
        <form>
            <div>
                <label>working typeahead</label>
                <input type="text" data-provide="typeahead" autocomplete="off" data-source='["hello","world"]' />
            </div>
            <div>
                <label>not working typeahead</label>
                <input type="text" data-provide="typeahead" autocomplete="off" data-source="['hello','world']" />
            </div>
        </form>
    </div>

see fiddle: http://jsfiddle.net/H4Qmh/4/

Answer 1

That is weird, but data-source=["hello", "world"] works, even that it doesn't look like clean HTML.

I'm wondering if it is being treated as JSON, in which case all elements must be wrapped in double-quotes. See: How to pass an array into jQuery .data() attribute.