javascript - JSON を使用して配列をローカルにし、それをページに解析する方法

Question

クラスに Local Storage を使用する必要があり、これを行うために JSON の stringify 関数を使用しています。私はそれを解析しようとしていますが、何らかの理由で機能していません。if ステートメントを使用すると、ct2 と cn2 が実際には機能しません。これが最初のhtmlです。

<div data-role="page" id="page1">
    <div data-role="header">
            <h1>Graphic Design</h1>

    </div>
    <div data-role="content" id="classList">
        <div id="classes" data-role="listview"></div>
    </div>
    <div data-role="footer" data-position="fixed" data-fullscreen="true">
            <h4>Department of Art</h4>

    </div>
</div>

---

そして、これが「json.js」という名前の JSON JavaScript ファイルです。

var cn = ["Art 150 Drawing 1", "Art 170 Basic Design 1", "Art 171 Basic Design 2", "Art 274 Typography 1", "Art 282 Computer Art 1", "Art 235 Ancient/Medevil Art", "Art 236 Renaissance/Mid-19th Century", "Art 237 Impressionism/Post Modernism", "Art 324 History of Photography", "Art 225 Photo 1 or Art 226 Digital Photo", "Art 351 Illustration 1", "Art 374 History of Graphic Design", "Art 370 Layout & Design 1", "Art 371 Layout & Design 2", "Art 372 Design & Production 1", "Art 451 Illustration 2", "Art 470 Advertising Graphic Design", "Art 471 Corporate Graphic Design", "Art 472 Typography 2", "Art 490 Internship", "Art 495 Portfolio Class"]
var ct = ["n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n", "n"]

localStorage.setItem("classTaken", JSON.stringify(ct));
localStorage.setItem("className", JSON.stringify(cn));

---

これは、「データを取得」し、解析された情報をリストビュー形式で「#classList」divに出力しようとする私のコードです。

$(document).ready(function () {

    $.getJSON("json.js", function (data) {

        var retrievedData = localStorage.getItem("className");
        var cn2 = JSON.parse(retrievedData);

        var retrievedData = localStorage.getItem("classTaken");
        var ct2 = JSON.parse(retrievedData);



    for (var i = 0; i < ct.length; i++) {
        var info = '<li>' + cn2[i] + '</li>'


        if (ct2[i] == "y") {
            $('#classes').append(info);
        } else {
            $('#notTaken').append(info);
        }
    }
});
    });