Use JQuery to change texts

You'll get it this way:

$(document).ready(function(){
    $('#package-service-toggle')
    .closest('.service')
    .find('p')
    .text('Transfer');
});

Since they can have other elements with the class .service , select the id of the input, search for the parent element that has the .service class and then search for the <p> tag, which only has one: / p>

$(document).ready(function(){
    $('#package-service-toggle')
    .closest('.service')
    .find('p')
    .text('Transfer');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><labelclass="service">
  <input type="checkbox" checked="checked" value="Service" id="package-service-toggle">
  <span></span>
  <p>Serviço</p>
</label>

Or you can use pure JavaScript that does the same thing:

document.addEventListener('DOMContentLoaded', function(){
   document.querySelector('#package-service-toggle')
   .parentNode.querySelector('p')
   .textContent = 'Transfer';
});

Example:

document.addEventListener('DOMContentLoaded', function(){
   document.querySelector('#package-service-toggle')
   .parentNode.querySelector('p')
   .textContent = 'Transfer';
});

<label class="service">
  <input type="checkbox" checked="checked" value="Service" id="package-service-toggle">
  <span></span>
  <p>Serviço</p>
</label>

  

You may need to make the change after full load   from page. To do this, change $(document).ready(function(){ to    $(window).on('load', function(){ .

The problem may be in the selector you are using. Because $("service") causes jQuery to look for a <service> element in the DOM, which I think is unlikely to happen. See:

$('service'); // Procura por <service>
$('#service'); // Procura por <??? id="service" />
$('.service'); // Procura por <??? class="service" />

A working example:

console.log('$("p"): ', $('p').html());   // Busca por tag
console.log('$("#p"): ', $('#p').html()); // Busca por id
console.log('$(".p"): ', $('.p').html()); // Busca por class

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><h3id="p">id == "p"</h3>
<p>tag == "p"</p>
<div class="p">class == "p"</div>

You can check the jQuery documentation for more selector options.

The error is that jQuery is not well specified for which element you want to manipulate.

So, since the service is a class you should put "." inside the jQuery selector. And he missed navigating to his paragraph.

$(document).ready(function(){
    $('.service p').html('Transfer');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><labelclass="service">
    <input type="checkbox" checked="checked" value="Service" id="package-service-toggle">
    <span></span>
    <p>Serviço</p>
</label>