Inserir Calculadora Javascript dentro de um Template

Detalhes da questão

Endereço do fórum: http://pokemonillium.forumeiros.com
Versão do fórum: phpBB3

Descrição

Olá, recentemente tenho tendado criar alguns JS para auxilar o processo de jogabilidade do meu fórum, no entanto como ainda estou iniciando nisto, é evidente que possa haver uma série de problemas.

O fato é que, o código em questão http://pokemonillium.forumeiros.com/h8-dados-de-20-faces-numero-aleatorio, assim como outros dois que desenvolvi, estes funcionam normalmente quando hospedados em uma nova página HTML, esteja ela usando os recursos do fórum ou não. No entanto, eu gostaria de colocadas dentro de um tooltip, que esta no canto superior esquerdo do meu fórum, de modo que ao clicar sobre o botão, abriria o Tooltip com esta calculadora dentro.

Porém, diversas tentativas foram feitas mas o mesmo tende a não funcionar quando alocado naquela região.

No caso, eu gostaria de colocar o código da calculadora dentro deste modal, especificamente nos locais que onde está escrito "A preencher".

Código:

<div class="tablon-anuncios">
                                                                                             
                <div id="dmg-tab" class="modal-content">
                                                                                                           
                        <table cellspacing="0"><tbody><tr><td>
<div class="ambientacion"><div align="justify" style="font-family: roboto; color: #3d72bd; background: white; padding: 10px; text-transform: uppercase; border-radius: 5px; opacity: 0.8; font-size: 10px;">A tabela a seguir disponibiliza o valor que cada movimento causa conforme seu POWER. Para saber mais sobre o conteúdo, acesse e leia <a href="http://pokemonillium.forumeiros.com/t19-base-de-dano-dos-movimentos"><strong>Dano base dos movimentos</strong></a></div>                          <center>
<img src="https://images2.imgbox.com/43/17/RClX18fs_o.png" />                             
                                                        </div>
                                                                                                                               
                                                </td>                                                                         
                                        </tr>
                                                                                                               
                                </tbody>
                                                                                                       
                        </table>
                                                                                                   
                </div>
                                                                                             
                <div id="st-tab" class="modal-content">
                                                                               
      A Preencher
                                                                                                 
                </div>
                                                                               
                <div id="status-tab" class="modal-content">
                                                                                             
                A Preencher
                                                                                               
                </div>
                                                                               
                <div id="weather-tab" class="modal-content"><div align="justify" style="font-family: roboto; color: #3d72bd; background: white; padding: 10px; text-transform: uppercase; border-radius: 5px; opacity: 0.8; font-size: 10px;">Conheça os principais climas e seus efeitos mais relevantes em combate. Para saber todos os efeitos das condições climáticas, acesse e leia <a href="http://pokemonillium.forumeiros.com/t10-estacoes-e-meteorologia"><strong>Estações e Meteorologia</strong></a></div>                          <center>
<br><img src="https://images2.imgbox.com/19/53/qjORNRd5_o.png" />                               
                                                                                     
                </div>
                             
        </div>

Creio que o não funcionamento do código seja a alocação dos códigos CSS e JS, entretanto mesmo usando a alocação externa destes, eu não consigo fazer com que a calculadora funcione atenda aos comandos do JS, tão pouco receba a customização do CSS.

UPzinho

Não tenho muita certeza do que está acontecendo, mas eu testei em meu fórum e funciona normalmente.
Tenta desativa os javascripts (que pode está atrapalhando talvez) e use esse código test que tem apenas uma calculadora.

Código:

<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script src='https://codebe0.neocities.org/paginaforum/assets/forumeiros/script.js'></script>
<link rel="stylesheet" src="https://codebe0.neocities.org/paginaforum/assets/forumeiros/style.css">
<meta charset="utf-8">
<form id="dadosintefaces">
      <div id="tabledados">
      <span>Dados de vinte faces</span>


<table class="tablerandnum0">   
   <tr>
      <td><label for="brutnum">D20</label></td>
     <td><label for="porcenum">%</label></td>
   </tr>
   <tr>
      <td><input style="border-radius: 10px;width: 100%; height: 50px;" class='brutnum' type="text" name="brutnum" disabled="disabled"/></td>
      <td><input style="border-radius: 10px; width: 100%; height: 50px;"  class='porcenum' type="text" name="porcenum" disabled="disabled"/></td>
    </tr>
</table>
    <br>
   
      <input type="button" value="Calcular"  class="calc">
      <input type="reset" value="Reiniciar"/>

   </div>

</form>


Obs; São arquivos externos logo vou excluir da minha host.

Vamos lá, vou tratá-lo como programador, ok?
Na teoria, você está executando o javascript ANTES da div existir, em outras palavras, varia de internet pra internet e bla bla bla...
Põe teu JS dentro da .load
http://api.jquery.com/load/

E talvez sane o problema.

Edit1:
Ex.:

Código:

$(window).load(function() {
// CÓDIGO
});