When using `$(document).ready(function(){...});` (version 1), the document ready function fires indefinitely. My guess is that the ready is fired everytime the jquery .load function finishes? Would like to confirm.

So I tried using jquery's `$(document).one('ready', function(){...});` function (version 2), but the function doesn't fire at all. What is wrong here?

index.html:

```
<!DOCTYPE html>
<html lang="en">
<head>
    <script src="/vendor/jquery/jquery-3.1.0.min.js"></script>
    <script src="/js/index.js"></script>
</head>
<body>
    <div class="index__header"></div>
    <div class="index__content"></div>
</body>
</html>

```

index.js version 1:

```
var _index = {
    loadLogin : function () {
        $(".index__content").load("/view/login.html");
    }
};

$(document).ready ( function () {
    $(".index__header").load("/view/header.html");
    _index.loadLogin();
});

```

index.js version 2:

```
var _index = {
    loadLogin : function () {
        $(".index__content").load("/view/login.html");
    }
};

$(document).one ('ready', function () {
    console.log('ready...');
    $(".index__header").load("/view/header.html");
    _index.loadLogin();
});

```