点击后我无法使用jquery进入下一个元素

Question

我有一个代码，我试图进入下一个元素，但我不能。一些想法？

HTML

<label class="right">
  <input>
</label>

<label>
  <input>
</label>

CSS

 .right {
  float: right;
}

jQuery

var next = $(".right").next();
var btn = $("button");

btn.on("click", function(){
    next.addClass("right");
})

jsfiddle：https://jsfiddle.net/vg5ngoyq/1/

Answer 1

在实际调用基于jQuery的代码之前，您的示例似乎没有定义jQuery。添加后，它应该按预期工作：

<!-- Make sure you have something like this defined before ever calling jQuery code-->
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script>
    $(function(){
         // It is now safe to use your jQuery code here...
    });
</script>

示例

var next = $(".right").next();
var btn = $("button");

btn.on("click", function() {
  next.addClass("right");
})

.right {
  float: right;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="right">
  <input>
</label>

<label>
  <input>
</label>

<button>CLICK</button>

Answer 2

你只是错过了在你的小提琴中包含jquery。

在jsFiddle之外，包括像这样的jquery，例如：

<script src="http://code.jquery.com/jquery-1.12.4.min.js"></script>

have a look