JavaScript click not working variable

After seeing this comment in the comments area:

I found the problem but requested an insecure script 'code.jquery.com/jquery-3.3.1.js'; This request has been blocked; the content must be served over HTTPS.

As stated in a few other answers about using HTTPS as the script's source (to which they are correct, and I am not taking away from those neither), it would be best if you were to use the following method which would resolve automatically to either HTTP or HTTPS, given which URL protocol is used under a given environment.

<script src="//code.jquery.com/jquery-3.3.1.js"></script>

while omitting the http: protocol altogether. This method is especially useful for other methods such as images, CSS, URL's, FTP, or anything that is to be used / pulled from an external protocol.

Please note that you won't be able to use the above method when accessing files from your own computer as file:///; this method is only meant for an external resource. Well you can, but the script just won't load.

Element with id must be only one on page. I think you have more when one element with id #twitter. And include all you js code at bottom of the page.

Using HTTPS and $(document).ready(function(){}) your code will work.

    <div class="jumbotron">
            <h1 class="display-3"><?php echo $config['website-name']; ?></h1>
            <p class="lead"><?php echo $lang["slogan"]; ?></p>
            <div class="btn-group" role="group">
                <a id="twitter" class="btn btn-info" href="#"><?php echo $lang["twitter_1"]; ?></a>
                <a id="youtube" class="btn btn-danger" href="#"><?php echo $lang["youtube_1"]; ?></a>
                <a id="facebook" class="btn btn-primary" href="#"><?php echo $lang["facebook_1"]; ?></a>
            </div>
            <br>
            <br>
            <div class="btn-group" role="group">
                <a id="vikipedi" class="btn btn-secondary" href="#"><?php echo $lang["wikipedia"]; ?></a>
                <a id="google" class="btn btn-success" href="#"><?php echo $lang["google_1"]; ?></a>
            </div>
            <p class="lead">
            <form class="form-group" action="index.php" method="post">
                <input id="url" name="url" type="url" class="form-control" autocomplete="on" placeholder="http://"
                       autofocus required/>
                <br>
                <input class="btn btn-primary btn-lg" type="submit" value="<?php echo $lang["go"]; ?>"/>
            </form>
        </div>
        <div class="text-center">
            <p style="font-size:11px">
                <small><?php echo $lang["agree"]; ?> <a
                            href="<?php echo $config['website-url']; ?>/?tos"><?php echo $lang["tos_2"]; ?></a>
                </small>
            </p>
        </div>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script>
  $(document).ready(function() {
    $('#twitter').click(function() {
      $('#url').val('https://twitter.com');
    });
    $('#youtube').click(function() {
      $('#url').val('https://youtube.com');
    });
    $('#facebook').click(function() {
      $('#url').val('https://facebook.com');
    });
    $('#google').click(function() {
      $('#url').val('https://google.com');
    });
    $('#vikipedi').click(function() {
      $('#url').val('https://wikipedia.org');
    });
  });

</script>