jQuery - ボタンをクリックしたときに文字列を追加する

Question

少しjqueryを知っている人のための簡単な質問。

$(document).ready(function(){ 
    $('.selected').on('click', function(){ 

私は、クリックされると（選択されたクラスが追加された）各li要素に追加されたクラスを持つナビゲーションメニューを持っています。私は、テキストがどのナビゲーションメニューに応じて変更することがあるので、私は立ち往生していますがreplaceWithすなわち

$('.banner-header').replaceWith('Eugene is too cool for school'); 

を使用して（クラス=「バナーヘッダ」で）ナビゲーション、下記の別の容器の内部のテキストを変更しようとしていますアイテムが押されています。私は長いif文を書くことができましたが、どこから始めるべきかわかりません、助けてください！

ありがとうございます。

Answer 1

あなたのナビゲーション構造はこのようなものです場合をできるこのスクリプトを使用してください：

$(document).ready(function(){ 
    $('.navigation li').on('click', function(e){ 
     $('.banner-slider').html($(e.target).html()); 
    }) 
}); 

これをチェックするdemo

Answer 2

あなたはこのような何か行うことができます：あなたは

<ul class="navigation"> 
    <li>Nav 1</li> 
    <li>Nav 2</li> 
    <li>Nav 3</li> 
</ul> 

<div class="banner-slider">Default Text</div> 

：https://jsfiddle.net/jLvppk3f/

HTML：

<ul> 
    <li class="menu" data-banner-text="A SELECTED"><a>A</a></li> 
    <li class="menu" data-banner-text="B SELECTED"><a>B</a></li> 
    <li class="menu" data-banner-text="C SELECTED"><a>C</a></li> 
    <li class="menu" data-banner-text="D SELECTED"><a>D</a></li> 
</ul> 
<div class="banner-header"> 
    TEST 
</div> 

JS：

$(document).ready(function(){ 
    $('.menu').on('click', function() { 
     $('.menu').removeClass('selected'); 
     $(this).addClass("selected"); 
     $('.banner-header').text($(this).data('banner-text')); 
    }) 
});