| 1 |
( function() { |
| 2 |
const link = document.querySelectorAll( |
| 3 |
'.wrap .tabs .mycontainer .myrow .box-menu a' |
| 4 |
); |
| 5 |
const row = document.querySelectorAll( '.wrap .data-content' ); |
| 6 |
|
| 7 |
link.forEach( function( item, index ) { |
| 8 |
link[ index ].addEventListener( 'click', function() { |
| 9 |
// Get id |
| 10 |
const getId = '.' + this.getAttribute( 'myid' ); |
| 11 |
|
| 12 |
// Remove all class active link |
| 13 |
link.forEach( function( element ) { |
| 14 |
element.classList.remove( 'active' ); |
| 15 |
} ); |
| 16 |
|
| 17 |
// Active class link |
| 18 |
this.classList.add( 'active' ); |
| 19 |
|
| 20 |
// Hide all data content |
| 21 |
row.forEach( function( element ) { |
| 22 |
element.classList.add( 'hide' ); |
| 23 |
element.classList.remove( 'active' ); |
| 24 |
} ); |
| 25 |
|
| 26 |
// Show data content active current |
| 27 |
document |
| 28 |
.querySelector( getId + '.data-content' ) |
| 29 |
.classList.remove( 'hide' ); |
| 30 |
document |
| 31 |
.querySelector( getId + '.data-content' ) |
| 32 |
.classList.add( 'active' ); |
| 33 |
} ); |
| 34 |
} ); |
| 35 |
}() ); |
| 36 |
|
