jQuery UI未在HTML表的所有行中设置样式

在使用HTML表时，我在重复jQueryUI完成的样式时遇到问题。我所要做的就是创建一个包含各种行的表。每行包含2列。第一列将只是文本。第二列将包含两个jQuery UI按钮。我想定义一个样式，所有行中的所有按钮都应该更改…但由于某些原因，它没有更改。只有前几行按钮可以设置样式

    <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
    <table cellpadding='10' align='center'>
        <tr style="display:block;border-bottom: 1px solid #CCCCCC !important;">
            <td width=400>Row 1</td>
            <td width=150>
                <button id="btnView" >View</button>
                <button id="btnCopy" >Copy</button>
            </td>
        </tr>
        <tr style="display:block;border-bottom: 1px solid #CCCCCC !important;">
            <td width=400>Row 2</td>
            <td width=150>
                <button id="btnView" >View</button>
                <button id="btnCopy" >Copy</button>
            </td>
        </tr>
        <tr style="display:block;border-bottom: 1px solid #CCCCCC !important;">
            <td width=400>Row 3</td>
            <td width=150>
                <button id="btnView" >View</button>
                <button id="btnCopy" >Copy</button>
            </td>
        </tr>
    </table>
    <script>
    $(function() {
      $("#btnView").button({
        icons: {primary: "ui-icon-search"},text: false,label: "View"});
      $("#btnCopy").button({
        icons: {primary: "ui-icon-newwin"},text: false,label: "Copy"});
    });
    </script>
    </body>
    </html>

一排
看法
复制
第2排
看法
复制
第3排
看法
复制
$（函数（）{
$（“#btnView”）。按钮({
图标：{primary:“ui图标搜索”}，文本：false，标签：“视图”}）；
$（“#btnCopy”）。按钮({
图标：{primary:“ui图标newwin”}，文本：false，标签：“Copy”}）；
});

下面是我的代码：

---

有人能解释一下为什么会发生这种情况吗？

您真的不应该在同一文档中多次使用ID。将ID更改为类（或仅添加类）并调整jQuery：

$(function () {
    $(".btnView").button({
        icons: {
            primary: "ui-icon-search"
        },
        text: false,
        label: "View"
    });
    $(".btnCopy").button({
        icons: {
            primary: "ui-icon-newwin"
        },
        text: false,
        label: "Copy"
    });
});

---

这里有一些添加的类：

id应该是HTML标记元素的唯一标识符。要使CSS样式应用于页面中的多个html元素，请使用类（如Niffler的回答中所述）。类允许您将一组CSS样式应用于多个html元素

它完成了任务，但您不需要真正使用

.each（）

只需

$（“.btnView”）。按钮（{…

）就足以感谢您的评论，我已从代码中删除

.each（）

。