爲什麼Jquery Jfiddle不起作用？

Question

我試圖讓這個基本的jQuery功能工作，所以我可以在我正在工作的網站的大部分使用相同的想法。查看了一個小時的代碼，我檢查了jquery文檔，以確保我的選擇器都在正確的位置，並且使用了正確的選擇器。

我只是不知道如何解決它，所以當我點擊按鈕，面板的字體顏色改變。

https://jsfiddle.net/p28jjo2u/

<div class="col-xs-3"> 
    <div id="panel4" class="panel panel-primary"> 
    <div class="panel-heading panel4"> 
     #panel4 
    </div> 
    </div> 
</div> 


<a class="btn btn-default" id="button" href="#" role="button">Link</a> 

CSS

#button { 
    outline: none; 
} 
#panel4 .panel4 { 
    color: white; 
} 

jQuery的

//playing around with panels and buttons in schedule tab 
$(document).ready(function(){ 
    $('#button').on('click', function() { 
    $('#panel4').find('.panel4').css({ 
     'color': 'red'; 
    }); 
    }); 
}); 

Answer 1

看到控制檯。

您的css對象中有另外的;。

https://jsfiddle.net/p28jjo2u/1/

//playing around with panels and buttons in schedule tab 
$(document).ready(function(){ 
    $('#button').on('click', function() { 
    $('#panel4').find('.panel4').css({ 
     'color': 'red' 
    }); 
    }); 
}); 

Answer 2

控制檯是你的朋友。你有一個語法錯誤

//playing around with panels and buttons in schedule tab 
$(document).ready(function(){ 
    $('#button').on('click', function() { 
    $('#panel4').find('.panel4').css({ 
     'color': 'red'; 
    }); 
    }); 
}); 

從'color': 'red';刪除分號，它應該工作。