Skip to main content
título editado
Enlace
user128299
user128299

Como cambiar jquery a Cambiar selectores de JQuery por selectores de JavaScript puro?

se añadieron 325 caracteres en el cuerpo
Origen Enlace

Quisiera cambiar este script de jquery a javascript puro, es para mostrar el contenido de unos tabs según se vaya dando click en las cabeceras. Y no tener que usar el CND de jquery porque entra en conflicto con otros componentes de mi pagina.

$(document).ready(function(){

$('.but1').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab1').css('display','block');
})

$('.but2').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab2').css('display','block');
})

$('.but3').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab3').css('display','block');
})

$('.but4').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab4').css('display','block');
})
    
});

he intentado esto hasta el momento

var but1  = document.getElementsByClassName('.but1').addEventListener('click',function(){
    var fundInfo = getElementsByClassName('.fund-info')
    fundInfo.style.display = 'none'
    var tab1 = getElementsByClassName('.tab1')
    tab1.style.display = 'block'

});

Quisiera cambiar este script de jquery a javascript puro, es para mostrar el contenido de unos tabs según se vaya dando click en las cabeceras. Y no tener que usar el CND de jquery porque entra en conflicto con otros componentes de mi pagina.

$(document).ready(function(){

$('.but1').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab1').css('display','block');
})

$('.but2').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab2').css('display','block');
})

$('.but3').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab3').css('display','block');
})

$('.but4').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab4').css('display','block');
})
    
});

Quisiera cambiar este script de jquery a javascript puro, es para mostrar el contenido de unos tabs según se vaya dando click en las cabeceras. Y no tener que usar el CND de jquery porque entra en conflicto con otros componentes de mi pagina.

$(document).ready(function(){

$('.but1').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab1').css('display','block');
})

$('.but2').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab2').css('display','block');
})

$('.but3').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab3').css('display','block');
})

$('.but4').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab4').css('display','block');
})
    
});

he intentado esto hasta el momento

var but1  = document.getElementsByClassName('.but1').addEventListener('click',function(){
    var fundInfo = getElementsByClassName('.fund-info')
    fundInfo.style.display = 'none'
    var tab1 = getElementsByClassName('.tab1')
    tab1.style.display = 'block'

});
Origen Enlace

Como cambiar jquery a JavaScript puro?

Quisiera cambiar este script de jquery a javascript puro, es para mostrar el contenido de unos tabs según se vaya dando click en las cabeceras. Y no tener que usar el CND de jquery porque entra en conflicto con otros componentes de mi pagina.

$(document).ready(function(){

$('.but1').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab1').css('display','block');
})

$('.but2').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab2').css('display','block');
})

$('.but3').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab3').css('display','block');
})

$('.but4').click(function(){
    
    $('.fund-info').css('display','none');
    $('.tab4').css('display','block');
})
    
});