Хранить массив с php на javascript

Я сделал таблицу заклинаний на phpmyadmin, и я пытаюсь получить к ней доступ через запрос ajax и сохранить ее полностью внутри массива javascript.

Load_hero_spell.php:

<?php
include("../php/connect_database.php");

$sth = $bdd->query("SELECT * FROM spells_hero LIMIT 4");
$result = $sth->fetchAll(PDO::FETCH_UNIQUE|PDO::FETCH_ASSOC);
$php_array = array();

foreach($result as $row)
{
    echo json_encode($result);
}  
?>

Файл Javacript:

var spells_array = [];

$(document).ready(function()
{
    $.ajax(
    {
        type: "POST",
        url: "../php/load_hero_spell.php",
        success: function(data)
        {
            spells_array = data;
            alert(data);
        },
        error: function() 
        { 
            alert("Request failure"); 
        }    
    });
alert(spells_array[1]);

});

Предупреждение (данные) отображаются примерно так:

Array
(
[0] => Array
    (
        [nick] => Spell 1
        [description] => Description 1
        [icon_dir] => ../../images/icons/spells/AbolishMagic.png
        [ownerID] => 1
    )

[1] => Array
    (
        [nick] => Spell 2
        [description] => description 2
        [icon_dir] => ../../images/icons/spells/AbominationExplosion.png
        [ownerID] => 1
    )
)

но тревожный (spells_array); отображать undefined.

Я хотел бы передать это значение объекту, чтобы я мог сделать что-то вроде

$(".Spell_icon").attr("src", Hero[1].spell[3].description);